AngularJs簡單編輯

我正在按照教程來獲得對angularjs的基本理解。在我的情況下，編輯鏈接不會將對象屬性加載迴文本框。請讓我知道我做錯了這裏是代碼和小提琴AngularJs簡單編輯

<body> 
<div class="scope" data-ng-app="mymodule" data-ng-controller="mycontroller"> 
    <h3>AngularJS Filter data sample </h3> 
    <br /> 
    Name:<br /> 
    <input type="text" data-ng-model="Name" /><br /> 
    <input type="text" data-ng-model="Position" /><br /> 
    <button data-ng-click="addfriend()"> Add Friend</button> 
    <br /> 
    <input type="text" data-ng-model="Namesearch" /><br /> 
    <ul> 
     <li class="li" data-ng-repeat="element in friendlist | filter:Namesearch | orderBy:'Name'"> 
      <strong> [{{$index + 1}}] {{ element.Name | uppercase}} working as {{ element.Position}} </strong> 
      [ <a href="#" ng-click="clearUser(element)">clear</a> 
      | <a href="#" ng-click="removeUser(element)">X</a> 
      | <a href="#" ng-click="editUser(1)">edit</a> 
      ] 
     </li> 
    </ul> 
</div> 
</body>

而且JS代碼

var mymodule = angular.module('mymodule', []) 
mymodule.controller('mycontroller', ['$scope', function ($scope) { 
    $scope.friendlist = 
     [{ Name: 'Zia', Position: 'AM' }, { Name: 'Zia1', Position: 'PM' }, { Name: 'Zia2', Position: 'GM' } 
     ]; 

    $scope.editUser = function (id) { 

     for (i in $scope.friendlist) { 
      if ($scope.friendlist[i].Name == 'Zia') { 

       $scope.newFriend = angular.copy($scope.friendlist[i]); 
      } 
     } 
    } 
}]);

fiddle

，也是我想知道的class="scope"在第一個的意義div

來源

2016-07-25 Zia

我沒有看到小提琴鏈接 –

'for（i in $ scope.friendlist）{' - 迭代數組時使用常規'for'循環 - 'for..in'用於迭代對象屬性。 – tymeJV

小提琴鏈接添加 – Zia

這是否解決了您的問題？ http://jsfiddle.net/3hv7y369/

在輸入中，您需要newFriend.Name和newFriend.Position來顯示覆制的值。我還完成了editUser()函數，以便與每個用戶一起工作。

來源

2016-07-25 20:37:36 fdelia

以及如何更新已更改的值以再次顯示在列表中 – Zia

我建議您創建一個「保存」按鈕，將值複製到'$ scope.friendlist'中的相應條目。這會自動更新顯示的列表。 – fdelia

AngularJs簡單編輯

回答

相關問題