Question

是否可以为ngInclude指定模型，以便在包含的模板内完成的任何更改都会反映在指定的模型上。例如：

我有一个模型如：

$scope.member = {

    name: "Member1",
    children:[
    {
        name:"Child1"
    },
    {
        name:"Child2"
    }
    ]
};

和模板：

<script type="text/ng-template" id="name.html">
    <input type="text" ng-model="member.name"/>
</script>

现在是否可以传递ngInclude“member”或任何子节点并修改其各自的名称属性？我尝试将ng-model传递给ng-template但它不起作用。我尝试使用预期的模型动态加载范围，但如果模型被删除，我将留下一个孤立模板。以下是jsfiddle代码：

http://jsfiddle.net/vaibhavgupta007/p7E5K/

我希望重复使用模板，而不是为不同的模型复制相同的模板。我已经提到了这个问题：

How to specify model to a ngInclude directive in AngularJS?

但是这里的模型不会被删除。

修改

到目前为止，我还没有掌握创建自定义指令的概念。但是会与ng-include帮助一起创建一个新的指令吗？

Answer 1

你上一个问题的答案是：是的。在指令中，您还定义了模板和范围。范围的内容完全在您手中。

见这里：http://jsfiddle.net/vgWQG/1/

用法：

Member: <member model="member"></member>
<ul>
    <li ng-repeat="child in member.children">
        Child {{$index}}: <member model="child"></member>   
    </li>
</ul>

指令：

app.directive('member', function(){
return {
    template : '<input type="text" ng-model="member.name"/>',
    replace : true,
    restrict: 'E',
    scope : {
        'member' : '=model'
    },
    link: function(scope, element, attr) {}
};

}）;

我已经在内联变体中移动了模板，因为我无法让模板缓存在jsfiddle中运行。在现实世界中， templateUrl：'name.html'应该没问题。

这是你想要的吗？

将ngInclude绑定到不同的模型

1 个答案: