无法读取未定义角度智能表的数据

Question

我想在不同的页面中加载不同的网格选项。

实际上我正在寻找将一个有角度的智能表包装到我自己的指令中以便重复使用不同的网格选项，但不幸的是我无法实现这一点，因为我得到了

  

无法读取未定义的数据

请你帮我确定一下我做错了什么以及如何根据视图在一个指令中绑定不同的网格选项（隔离范围）。

我想在不同的页面中加载不同的网格选项。

HTML

<ltcg-upd-grid options="vm.gridData"></ltcg-upd-grid>

网格HTML

<table st-table="gridOptions" class="table table-condensed table-hover">
    <thead>
        <tr>
            <th>Type</th>
            <th>Name</th>
            <th>Address</th>
            <th ng-if="city">City/State</th>
            <th ng-if="zip">Zip</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="row in gridOptions">
            <td width="20%">{{row.type | uppercase}}</td>
            <td width="20%">{{row.name  | uppercase}}</td>
            <td width="30%">{{row.address | uppercase}}</td>
            <td width="15%" ng-if="city">{{row.cityState | uppercase}}</td>
            <td width="15%" ng-if="zip">{{row.zip | uppercase}}</td>
        </tr>
    </tbody>
</table>

JS

控制器

    export class planDetailsCtrl {

        static $inject: Array<string> = ['$scope'];
        constructor(private scope: ng.IFormController) {
            this.activate();
        }

        gridOptions: any = null;
        gridData: any = null;
        all:any;

        activate() {

            this.gridOptions = [
                { type: 'Home healthy Mohan', name: 'Renard', address: '311 chestnu street', cityState: 'addison il', zip: '60101' },
                { type: 'Home healthy Agency', name: 'Renard', address: '311 chestnu street', cityState: 'addison il', zip: '60105' },
                { type: 'Home healthy Agency', name: 'Renard', address: '311 chestnu street', cityState: 'addison il', zip: '60109' },
                { type: 'Home healthy Agency', name: 'Renard', address: '311 chestnu street', cityState: 'addison il', zip: '60111' },
                { type: 'Home healthy Agency', name: 'Renard', address: '311 chestnu street', cityState: 'addison il', zip: '60145' },
                { type: 'Home healthy Agency', name: 'Renard', address: '311 chestnu street', cityState: 'addison il', zip: '60199' }

            ];


            this.gridData = {
                data: this.gridOptions
            };


        }
    }

    angular
        .module('app.tasks.provider')
        .controller('app.tasks.provider.planDetailsCtrl', planDetailsCtrl);

打字稿指令

class LtcgUpdGridDirective implements ng.IDirective {

        static instance(): ng.IDirective { return new LtcgUpdGridDirective(); }
        restrict: string = 'E';        
        transclude = true;
         scope = {
            'cityVisible': "@",
            'zipVisble': "@"
        }; 

        templateUrl = 'views/widgets/ltcg-updgrid.html';       

        controller = updGridCtrl;
        controllerAs = 'vm';
        bindToController = true;
        link = (scope: any, element: ng.IAugmentedJQuery, attrs: IGridAttributes, ctrl: any) => {            

            console.log("link in");
            console.log("read data" + scope.options.data);

            scope.$watch("options", function (newValue, OldValue, scope) {
                console.log(newValue);
                scope.gridOptions = scope.options.data //private scoped from options : '=',              

            });            



         } 
    }

    angular
        .module('app.widgets')
        .directive('ltcgUpdGrid', LtcgUpdGridDirective.instance);