AngularJS:从指令更​​新父范围

时间:2015-02-25 14:29:41

标签: javascript angularjs angularjs-directive angularjs-scope

我有一个角度控制器和指令

控制器

app.controller('gridController',['$scope',function($scope){                     
                    $scope.btns=false;
                    $scope.details_tab=false;
                    $scope.currentid={id:''};
                    $scope.setId=function(id){
                        $scope.currentid=id;
                    };
}]);

指令

       .directive('jqGrid',function(){

                    return{
                        restrict: 'E',
                        //require: 'ngModel',

                        link:function(scope, element, attrs){
                            jQuery("#jqgrid").jqGrid({
                                data : scope.jqgrid_data,
                                datatype : "local",
                                height : 'auto',
                                colNames : ['case', 'Name', 'Assigned Date'],
                                colModel : [
                                    { name : 'act', index:'act', sortable:false }, 
                                    { name : 'id', index : 'id' }, 
                                    { name : 'date', index : 'date', editable : true }, 
                                    { name : 'name', index : 'name', editable : true }, 
                                    { name : 'amount', index : 'amount', align : "right", editable : true }, 
                                    { name : 'tax', index : 'tax', align : "right", editable : true }, 
                                    { name : 'total', index : 'total', align : "right", editable : true }, 
                                    { name : 'note', index : 'note', sortable : false, editable : true }],
                                rowNum : 10,
                                rowList : [10, 20, 30],
                                pager : '#pjqgrid',
                                sortname : 'id',
                                toolbarfilter: true,
                                viewrecords : true,
                                sortorder : "asc",
                                gridComplete: function(){

                                },
                                multiselect : true,
                                autowidth : true,
                                onSelectRow : function (rowid, status) {
                                              scope.btns=true;
                                               scope.details_tab=true;
                                                scope.currentid='';
                                                }

        })}});

html:

            <jq-grid jqdata="jqgrid_data">
                <table id="jqgrid" ></table>
            </jq-grid>

在指令中我想更新范围中的变量 它在本地范围内更新,但不在控制器范围内更新。如何直接更新范围?

3 个答案:

答案 0 :(得分:0)

scope: true添加到返回的指令对象。

.directive('jqGrid',function(){
    return {
        restrict: 'E',
        scope: true,
        ...

答案 1 :(得分:0)

app.controller('gridController',['$scope',function($scope){                     
                    $scope.btns=false;
                    $scope.details_tab=false;
                    $scope.currentid={id:''};
                    $scope.setId=function(id){
                        $scope.currentid.id=id; // change 
                    };
}]);

  onSelectRow : function (rowid, status) {
                                              scope.btns=true;
                                               scope.details_tab=true;
                                                scope.currentid.id=rowid;
                                                }

答案 2 :(得分:0)

我用

解决了这个问题
           scope.$apply();