angularjs - Editing model property inside ngRepeat, error undefined -
i'm quite inexperienced angularjs. i've read answers might related not clear enough me.
i've created table
using ngrepeat
, want change websites name inside table
after clicking save button
.
but error undefined
.
my code:
var webapp = angular.module('webapp', []); //controllers webapp.controller ('websitesctrl', function ($scope, websites) { //$scope.x = new website('1','3343','32434','name','privkey','pubkey','userid'); $scope.websites = websites.get(); //this function displayes site details $scope.expandweb = function(website) { console.log('expand'); $scope.websitenew = angular.copy(website); $scope.showname = true; }; $scope.saveweb = function(websitenew) { $scope.website.name = websitenew.name; $scope.showname = false; }; }); //services webapp.factory('websites', function(){ var websites = {}; websites.get = function() { return [{ id: '1', created: '223112', updated: '222212', name: 'google.com', secretkey: 'dhsd#22%$', publickey: '234233@@@', useridentification:'cookies' }, { id: '2', created: '1111112', updated: '444412', name: 'walla.com', secretkey: 'dhsd#22%$', publickey: '234233@@@', useridentification:'none-cookies' }, { id: '3', created: '1111112', updated: '444412', name: 'umms.com', secretkey: 'dhsd#22%$', publickey: '234233@@@', useridentification:'none-cookies' } ] }; return websites; });
my html:
<html ng-app="webapp"> <head> <script data-require="angular.js@1.0.7" data-semver="1.0.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script> <link rel="stylesheet" href="style.css" /> <script src="app.js"></script> </head> <body ng-controller='websitesctrl'> <table > <tr ng-repeat="website in websites"> <td> <a href="/websites/{{website.id}}">{{website.name}}</a> <button ng-click='expandweb(website)'>edit name</button> </td> </tr> </table> <div ng-show="showname"> <input ng-model="websitenew.name"/> <button ng-click='saveweb(websitenew)'>save</button> </div> </body> </html>
$scope.website
undefined in saveweb
method. should set in expandweb
method.
$scope.expandweb = function(website) { console.log('expand'); $scope.website = website; $scope.websitenew = angular.copy(website); $scope.showname = true; };
Comments
Post a Comment