Question

我有一个由以下内容组成的指令：

每次单击按钮时，都会在表单中附加一个新表单。

问题：我需要为每个附加的新表单设置不同的ng-model。几乎把我的头撞在墙上一整天后，我仍然无能为力

nb：使用ng-repeat的动态ng模型是不可能的，因为我一次只需要附加1个模板

这是代码：plunkr版本：https://plnkr.co/edit/4zjo8xRHD5gMm5kU77Tv?p=info

    app.directive("addIsmb", function ($compile) {
    return {
        restrict: "A",
        link: function (scope, element, attrs) {
            element.bind("click", function () {
                var toAppend = $compile("<i-smb></i-smb>")(scope)
                $(".iSMBHolder").append(toAppend);
                $(".countISMB").each(function(){
                    var self = $(this);
                    var index = self.parent().index();
                    scope.ctrl.iIndex = index+1;
                })
              console.log(scope.ctrl.iIndex)  
            })
        }
    }
})

我的模板指令

app.directive("isbm", function(){
  return {
    restrict: "E", 
    templateURL: "app/location of my template",
    replace: false
  }
})

控制器：我尝试创建一个数组，它将在for循环中返回一个对象，这样我就可以使用每个返回的对象作为ng-model但是失败了。

app.controller("separated.inputs", ["C2CData", "channelData", function (C2CData, channelData) {
  self.iList = new Array(10);

    for (i = 0; i < self.iList.length; i++){
        self.iList[i] = {}
    };

}])

我需要动态ng-model的模板

<div md-whiteframe="6" layout="column" class="iSMB animated fadeInUp countISMB ncInputSettings" get-idex>
    <div layout="row" layout-align="space-between center" class="notToBeFolded">
        <div layout="row" layout-align="start center" id="ncInputTitle">
            <md-icon md-svg-src="icons/ncInputTitleSettings.svg" class="md-36"></md-icon>
            <md-content>{{ctrl.iList[ctrl.iIndex.name]}}</md-content>
        </div>
        <md-button class="md-primary ncDeleteSMBS" delete-ismb>CANCEL</md-button>
    </div>
    <div class="toBeFolded">
        <div layout="row" class="ncInputRow">
            <div flex="40" class="ncBorderMe" layout-align="start center" layout="row" layout-padding>
                <md-content class="md-heading">Name</md-content>
            </div>
            <div flex layout="row" layout-align="space-between center" layout-padding>
                <input placeholder="Pick a Name" disabled class="ncInputListInput" ng-model="ctrl.iList[ctrl.iIndex.name]"/>
                <md-button edit-field aria-label="Chose a name" class="ncMdButton">
                    <md-icon class="material-icon ncIconNoMargin">edit</md-icon>
                </md-button>
            </div>
        </div>
    </div>
</div>

Answer 1

您可以像evalin('base',['Fahrzeug.Klima_Regler = ' num2str(Klima_Regler_GUI)])一样在大多数Angular指令中使用Javascript表达式。你为什么不试试这个：

ng-model

然后在你的控制器内：

<input placeholder="Pick a Name" disabled class="ncInputListInput" ng-model="scopeFunction($index)"/>

每次调用指令时都要设置动态ng-model

1 个答案: