Question

我和我的团队一直在处理XML文件并根据所述XML编写设置页面。这里的元素是动态生成的。请在下面找到如何生成元素的示例。

 settings.getToggle = function(label, def){var str1 = '<li class="item lighten orange">';
var str2 = label;  //get label from xml
return str1 + str2 + '<label class="switch orange">' +
                     '<input type="checkbox" ng-model="testmodel" class="switch-input" >' +
                     '<span class="switch-label" data-on="Aan" data-off="Uit"></span>' +
                     '<span class="switch-handle"  ></span></label></li>';};

这段小代码确保当XML文件显示：“您必须显示一个togglebutton”时，会将一个togglebutton添加到设置页面并相应地显示。可以有多个相同类型的按钮。在控制器中我们称这个代码为：（ settings.getToggle（...）;

  $(this).find("setting[type='toggle']").each(function () {
                      var label = $(this).find("label").text();
                       var def = $(this).find("default");
                       $("div>.list").append(settings.getToggle(label, def));
                   });

到此为止不是问题。 html完美无缺地生成。

此时我们必须能够将处理程序附加到所述元素。这就是麻烦开始的地方。

在使用离子布局添加ng-change到这个html5复选框，甚至ng-click，ng-model，......你给它命名，代码似乎根本没有响应。

示例（html的其余部分 - ＆gt;第一个代码片段）：

'<input type="checkbox" ng-click()="testmodel" class="switch-input" >'

结合角度代码（在工作，测试的控制器中）

    .controller('SettingsController', function ($scope)
{
    $scope.testmodel = function(){
        alert("click");
    };

此情况下的警报不会弹出。有谁知道如何解决这一问题？ 这是我的主要和最重要的问题。

通过扩展，我对角度相对较新，我很难想象如何从那里前进。我曾想过为每个元素添加一个更改侦听器，然后以某种方式获取元素的名称（模型？）并将它们放在json var和localstorage中。有没有人有更具体的想法。我其实不知道该做什么。

最后，我想提前为发布和角色错误道歉。我只是初学者（stackoverflow和angular）。

Answer 1

在()上更改为ng-click，并将其附加到函数名称testmodel()：

'<input type="checkbox" ng-click="testmodel()" class="switch-input" >'

See the plnkr.

如果你打算使用ng-change指令，那么你需要ng-model：

<input type="checkbox" ng-model='this.checked' ng-change="testmodel()" class="switch-input" >

并在控制器中的方法中：

$scope.testmodel = function() {
   alert(this.checked);
};

ng-change with ng-model example plnkr.

ng-change里面动态生成的html / ionic复选框没有绑定

1 个答案: