首页 > 如何在 AngularJS 里对隐藏元素数据绑定?

如何在 AngularJS 里对隐藏元素数据绑定?

大概场景,比如有一个dropdown,当我选择下拉菜单的某个项后,Javascript会将一个type="hidden"或者display:none;input标签的值设为某个值,同时绑定在input上的一个Angular $scope的值也相应改变。

我试过在input上绑定ng-model、或者设置value="{{oneScope}}"但是Angular scope的值始终不随之改变,似乎Angular的数据绑定是基于input标签上发生的某个Javascript事件进行数据更新的……

于是这种场景下应该如何实现才能触发数据更新呢?


http://www.sapiensworks.com/blog/post/2013/06/22/Binding-AngularJs-Model-to-Hidden-Fields.aspx


应该在dropdown ng-change事件 去改变scope里的值


最后解决的方法是在使用jQuery对input进行赋值的时候调用$scope.$apply()函数更新数据,实现如下:

AngularDropDown : (selector, event = 'click') ->
    $(selector).dropdown
        on: event
        onChange: (text, value) ->
            $("#{selector} .text").html value
            $("#{selector} input.angularData").val text
            # 在Angular外调取$scope
            scope = angular.element($("#{selector} input.angularData")).scope()
            # 更新数据
            scope.$apply () ->
                scope.registData.defaltContact = text
【热门文章】
【热门文章】