【问题标题】:ng-click not firing in ng-repeat?ng-click 没有在 ng-repeat 中触发?
【发布时间】:2014-02-02 21:13:02
【问题描述】:

好的,我有以下内容:

    scope.monthpickerclick = function(scope){
    $window.alert('test'); 
        console.log(scope);
    };
scope.monthpicker = function(alldatesdumparray){

var alldatesdump = booking.getalldates();
var alldatesdumparray = $.map(booking.getalldates(), function(value, index) {
    var dropdates = new Date(value.date);
    var dropdate = dropdates.getDate();
    var month=new Array();
month[0]="January";
month[1]="February";
month[2]="March";
month[3]="April";
month[4]="May";
month[5]="June";
month[6]="July";
month[7]="August";
month[8]="September";
month[9]="October";
month[10]="November";
month[11]="December";
    var dropmonth = month[dropdates.getMonth()];
    var checkmonth = dropdates.getMonth();
    var dropyear = dropdates.getFullYear();
    var joindates = dropmonth + '-' + dropyear;
    var monthyear = checkmonth + '- '
    var today = new Date();
    var mm = today.getMonth(); //January is 0!
    var yyyy = today.getFullYear();

    if(mm < checkmonth && dropyear < yyyy){

    }else{
        value.date = joindates;
        value.month = checkmonth;
        value.Year =  dropyear;
        return [value];
    }
});
//console.log(alldatesdumparray);
    var dupes = {};
    var singles = [];
$.each(alldatesdumparray, function(i, el) {
    if (!dupes[el.date]) {
        dupes[el.date] = true;
        singles.push(el);
        return singles;
    }
});
return singles;
};

HTML:

<select >
<option ng-click="monthpickerclick()" class="animate-repeat" ng-repeat="returnpicker in monthpicker(singles)" value="{{returnpicker.date}}">{{returnpicker.date}}</option>
</select>

WH 输出:

<select>
    <!-- ngRepeat: returnpicker in monthpicker(singles) -->
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="January-2014">January-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="February-2014">February-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="March-2014">March-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="April-2014">April-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="May-2014">May-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="June-2014">June-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="July-2014">July-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="August-2014">August-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="September-2014">September-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="October-2014">October-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="November-2014">November-2014</option>
    <option ng-click="monthpickerclick()" class="animate-repeat ng-scope ng-binding" ng-repeat="returnpicker in monthpicker(singles)" value="December-2014">December-2014</option>
</select>

看起来不错... 那么为什么当我选择一个选项时monthpickerclick()不触发? 克里斯

【问题讨论】:

  • 你试过&lt;select ng-change="monthpickerclick()"&gt;吗?
  • 它需要 ng-model,在这种情况下我没有...
  • 看起来你的函数期望传递一些东西,但是在 ng-click 上,它没有传递任何东西。另外,将$ 放在您的定义前面
  • 我的功能至少应该提醒...
  • 您真正需要的是ng-model="something"$scope.$watch('something', function(){...})

标签: javascript angularjs


【解决方案1】:

主要问题是您应该将这些功能附加到选择项,而不是选项并使用 ng-change

<select ng-change="monthPickerClick()" >
    <option class="animate-repeat" ng-repeat="returnpicker in monthpicker(singles)" value="{{returnpicker.date}}">{{returnpicker.date}}</option>
</select>

编辑:添加您的建议

<select ng-change="monthPickerClick()" ng-model="myItem">
    <option class="animate-repeat" ng-repeat="returnpicker in monthpicker(singles)" value="{{returnpicker.date}}">{{returnpicker.date}}</option>
</select>

$scope.$watch('myItem', function(){
    //do something
});

第二次编辑:

<select ng-change="monthPickerClick()" ng-model="myItem" ng-init="savedReturnPicker=[]">
    <option class="animate-repeat" model="savedReturnPicker[returnpicker.date]" ng-repeat="returnpicker in monthpicker(singles)" value="{{returnpicker}}">{{returnpicker.date}}</option>
</select>

//save the returnPicker to a model called savedReturnPicker, then look up with $scope.savedReturnPicker[someDateGoesHere}

【讨论】:

  • 我如何返回对象 returnpicker 而不仅仅是 myitme 中选项的值...?
  • 你有示例函数吗?
  • 再次编辑。初始化一个数组,savedReturnPicker=[],然后按该名称附加到模型并由您的 .date 索引。这里还有更多工作要做,但我想你明白了。
  • stackoverflow.com/questions/21121923/… 如果你想回答这个问题,我刚刚添加了另一个问题
  • jsFiddle 或类似的东西,这样更容易帮助。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-09-14
  • 2013-10-21
  • 2016-11-13
  • 2016-12-30
  • 1970-01-01
相关资源
最近更新 更多