爲什麼ng-click對ng函數沒有影響？

嘗試在客戶端控制器文件中使用ng鍵單擊HTML中的按鈕來運行功能。無所事事，不知道爲什麼。所有幫助讚賞。爲什麼ng-click對ng函數沒有影響？

HTML

<body ng-controller="CriminalsCtrl as criminals"> 
    <h1>Infamous Criminals</h1> 
    <section> 
    <ul id="criminals"> 
     <li ng-repeat="criminals in criminals.criminalArray"> 
     <strong>{{criminals.name}}</strong> <em>{{criminals.location}}</em> 
     <span class="status {{criminals.status}}">{{criminals.status}}</span> 
     <button ng-click="criminals.criminalsDelete(criminal)" class="delete">X</button> 
     </li> 
    </ul>

控制器

vm.criminalsDelete = criminalsDelete; 

    function criminalsDelete(criminal) { 
    console.log('ng-click'); 
    $http.delete(`http://localhost:4000/api/criminals/${criminal.id}`) 
    .then(() => { 
     const index = vm.criminalArray.indexOf(criminal); 
     vm.criminalArray.splice(index, 1); 
    }); 
    }

來源

2017-08-01 Chris Catley

爲controllerAs語法criminals名正在由criminals名稱爲ng-repeat迭代器隱藏。用別的東西迭代器：

<body ng-controller="CriminalsCtrl as criminals"> 
    <h1>Infamous Criminals</h1> 
    <section> 
    <ul id="criminals"> 
     <li ng-repeat="perp ̶c̶r̶i̶m̶i̶n̶a̶l̶s̶ in criminals.criminalArray"> 
     <strong>{{perp.name}}</strong> <em>{{perp.location}}</em> 
     <span class="status {{perp.status}}">{{perp.status}}</span> 
     <button ng-click="criminals.criminalsDelete(perp)" class="delete">X</button> 
     </li> 
    </ul>

來源

2017-08-01 18:50:36 georgeawg

我還要重新命名編號到別的東西也只是爲了避免混淆。好的趕上！ – Naomi

非常感謝！ –

的代碼這種形式進行刪除控制器最好

 $scope.delete = function(index){ 
    $scope.Criminals.splice(index,1); 
}

我做了一個完整的CRUD了你一個例子，你只需要把HTTP服務。

查看下面的代碼片段。

angular.module('App', []).controller('CrudCriminal', ['$scope', 
 
\t function($scope) { 
 
\t $scope.Criminals = [ 
 
\t  { 
 
\t   name : "walter", 
 
\t   location : "abq", 
 
\t   status : "dead", 
 
\t   editable : false 
 
\t  }, 
 
\t  { 
 
\t   name : "Jesse", 
 
\t   location : "nebraska", 
 
\t   status : "out", 
 
\t   editable : false 
 
\t  } 
 
\t  ]; 
 
\t 
 
\t $scope.entity = {} 
 
\t  
 
\t $scope.edit = function(index){ 
 
\t $scope.entity = $scope.Criminals[index]; 
 
\t $scope.entity.index = index; 
 
\t $scope.entity.editable = true; 
 
\t } 
 
\t  
 
\t $scope.delete = function(index){ 
 
\t $scope.Criminals.splice(index,1); 
 
\t } 
 
\t  
 
\t $scope.save = function(index){ 
 
\t $scope.Criminals[index].editable = false; 
 
\t  
 
\t } 
 
\t  
 
\t $scope.add = function(){ 
 
\t $scope.Criminals.push({ 
 
\t  name : "", 
 
     location : "", 
 
     status : "", 
 
     editable : true 
 
\t }) 
 
\t } 
 
\t } 
 
]);

/* Styles go here */ 
 
body{ 
 
    margin:10px; 
 
    font-size:14px; 
 
    font-family:Arial; 
 
} 
 
table{ 
 
    border:1px solid #333; 
 
    border-collapse:collapse; 
 
    width:100%; 
 
} 
 
table tr td{ 
 
    border:1px solid #333; 
 
    padding:10px; 
 
} 
 
table tr td span{ 
 
    cursor:pointer; 
 
}

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script src="https://code.angularjs.org/1.2.16/angular.js"></script> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
    <body ng-app="App"> 
 
    <div ng-controller="CrudCriminal"> 
 
     <h1>Infamous Criminals</h1> 
 
    <table> 
 
     <tr> 
 
     <td>Name</td> 
 
     <td>Location</td> 
 
     <td>Status</td> 
 
     <td><span ng-click="add()">Add New</span></td> 
 
     </tr> 
 
     <tr ng-repeat="criminal in Criminals"> 
 
     <td> 
 
      <input type="text" ng-model="criminal.name" ng-show="criminal.editable"> 
 
      <span ng-hide="criminal.editable">{{ criminal.name }}</span> 
 
     </td> 
 
     <td> 
 
      <input type="text" ng-model="criminal.location" ng-show="criminal.editable"> 
 
      <span ng-hide="criminal.editable">{{ criminal.location }}</span> 
 
     </td> 
 
     <td> 
 
      <input type="text" ng-model="criminal.status" ng-show="criminal.editable"> 
 
      <span ng-hide="criminal.editable">{{ criminal.status }}</span> 
 
     </td> 
 
     <td> 
 
      <span ng-click="edit($index)" ng-hide="criminal.editable">Edit</span> 
 
      <span ng-click="save($index)" ng-show="criminal.editable">Save</span> 
 
      <span ng-click="delete($index)"> | Delete</span> 
 
     </td> 
 
     </tr> 
 
    </table> 
 
    </div> 
 
    </body> 
 

 
</html>

來源

2017-08-01 19:28:26

爲什麼ng-click對ng函數沒有影響？

回答

相關問題