Question

我正在尝试使用angular设计内联编辑模板。我已按照本教程

http://blog.shubhamsaxena.com/creating-simple-inline-editing-with-angularjs/

我的代码是

<table class="table">
        <tbody>
            <tr class="table-row" ng-repeat="admin in admins" ng-include="getTemplate(admin)"> 
                <script type="text/ng-template" id="display">
                    <td class="table-img">
                       <img src="images/in.jpg" alt="" />
                    </td>
                    <td class="table-text">
                        <h6>{{admin.firstname}} {{admin.lastname}}</h6>
                        <p>{{admin.email}}</p>
                        <p>{{admin.phone}}</p>
                    </td>
                    <td>
                        <span class="fam">{{admin.dept_name}}</span>
                    </td>
                    <td class="march">
                        <button class="btn-transparent btn" ng-click="editAdmin(admin)"><i class="fa fa-edit fa-2x"></i></button>
                    </td>
                    <td>
                        <button class="btn-transparent btn"><i class="fa fa-remove fa-2x"></i></button>
                    </td>
                </script>
                <script type="text/ng-template" id="edit">

                </script>
            </tr>
        </tbody>
    </table>

angular js code

$scope.getTemplate = function (admin) {
        if (admin.id === $scope.selected.id){
            $scope.template = 'edit';
        }
        else{
            $scope.template = 'display';
        }
        return $scope.template;
    };
    $scope.editAdmin = function (admin) {
        $scope.selected = angular.copy(admin);
    };

但是当我运行它时，它在控制台中给出了404错误

www.ip地址/仪表板/主要/显示

＆＃34;显示＆＃34;是我可以在第1段中验证的脚本ID。

我的问题是它为什么搜索＆＃34;显示＆＃34;网址中的ID。

范围变量管理员有数据但在我在脚本下编写时不会访问。

请帮忙。

Answer 1

404表示未找到

 $scope.getTemplate = function (employee) {
        if (employee.empID === $scope.selected.empID){
            return 'edit';
        }
        else return 'display';
    };

getTemplate如果Id已经存在，那么它将在编辑脚本中打开，否则将在显示脚本中显示

HTML

<tbody>
                    <tr ng-repeat="employee in employees" ng-include="getTemplate(employee)">
                    <script type="text/ng-template" id="display">
                        <td>{{employee.empName}}</td>
                        <td>{{employee.empEmail}}</td>
                        <td>{{employee.empSalary | currency:"&#8377;"}}</td>
                        <td>{{employee.active | active}}</td>
                        <td>
                            <button type="button" class="btn btn-primary" ng-click="editEmployee(employee)">Edit</button>
                            <button type="button" class="btn btn-danger" ng-click="deleteEmployee(employee)">Delete</button>
                        </td>
                    </script>
                    <script type="text/ng-template" id="edit">
                        <td><input type="text" ng-model=employee.empName class="form-control input-sm"/></td>
                        <td><input type="text" ng-model=employee.empEmail class="form-control input-sm"/></td>
                        <td><input type="text" ng-model=employee.empSalary class="form-control input-sm"/></td>
                        <td>
                            <select class="form-control input-sm" ng-model=employee.active>
                                <option value='1'>Yes</option>
                                <option value='0'>No</option>
                            </select>
                        </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>
                </tbody>

无法在脚本下的ng-template中访问范围变量

1 个答案: