Angular Js中的內聯編輯

Question

我想在Angular JS中實現內聯編輯，但是下面的代碼不工作。

<tr ng-repeat="employee in employees" ng-include="getTemplate(employee)"> 
        <script type="text/ng-template" id="display"> 
        <td>{{employee.Name}}</td> 
        <td ng-bind="employee.Age"></td> 
        <td ng-bind="employee.City"></td> 
        <td><a href="#" ng-click="EditEmployee(employee.EmpId)">Edit</a> </td> 
        <td><a href="#" ng-click="DeleteEmployee(employee.EmpId)">Delete</a> </td> 
</script> 


        <script type="text/ng-template" id="edit"> 
    <td><input type="hidden" ng-model="newemployee.EmpId" class="form-control input-sm"/></td> 
    <td><input type="text" ng-model="newemployee.Name" class="form-control input-sm"/></td> 
    <td><input type="text" ng-model="newemployee.Age" class="form-control input-sm"/></td> 
    <td><input type="text" ng-model="newemployee.City" class="form-control input-sm"/></td> 
    <td> 
    <button type="button" class="btn btn-primary" ng-click="updateEmployee(employee)">Save</button> 
    <button type="button" class="btn btn-danger" ng-click="reset()">Cancel</button> 
    </td> 
        </script> 
       </tr> 

下面的代碼是沒有得到called-

$scope.employees = []; 
$scope.getTemplate = function (employee) { 
     if (employee.empId === $scope.selected.empId){ 
      return 'edit'; 
     } 
     else return 'display'; 
    }; 

Answer 1

的ngInclude指令主要用於包括HTML的塊到您的網頁。我不確定你在這裏真的需要它。

也許你可以簡單地做：

<tr ng-repeat="employee in employees" {{getTemplate(employee)}}"> 

或添加這些標籤到類的屬性，如果你喜歡：

<tr ng-repeat="employee in employees" class="{{getTemplate(employee)}}">