带指令的角度模型

时间:2014-06-30 06:31:51

标签: javascript jquery angularjs angularjs-directive angularjs-model

所以我的模板中出现错误,因为它不喜欢ng-model =“event。{{name}}”。我想知道如何让模型成为ng-model =“event.date_end”。

我也想知道这个jquery datetimepicker是否会在链接中正确初始化(当我把它作为.html文件中的一个函数时它起作用,但当我把它放在控制器中时却没有。)

此外,我不得不使用jquery来触发输入上的“输入”以更新模型,但我希望在指令中以角度方式执行此操作。

希望我离这个方向不太远。

感谢。

HTML

<date-picker id="dateendPicker" name="{{date_end}}"></date-picker>

JS

App.directive('datePicker', function(){
return {
scope: {
    name : '@'
},
restrict: 'AE',
replace: 'true',
template: '<div class="date"><div class="input-group"><input type="text" class="form-control" id="{{name}}" name="{{name}}" ng-model="event.{{name}}" ng-blur="setModel()" required/><span class="input-group-addon"><i class="fa fa-calendar"></i></span></div></div>',
link: function(scope, elem, attrs){

    attrs.$observe('key', function(value) {
       var this_id = value;
    });

    $(''+this_id+'').datetimepicker({
        pickTime: false,
            icons: {
            time: "fa fa-clock-o",
            date: "fa fa-calendar",
            up: "fa fa-arrow-up",
            down: "fa fa-arrow-down"
        }
    });

    //set model on blur
    function setModel(){
        elem.find('input').trigger('input');
    }

    }
  }
});

0 个答案:

没有答案