AngularJS 的问题

Problems with AngularJS

提问人:B.West 提问时间:8/4/2016 更新时间:8/4/2016 访问量:447

问:

我对 AngularJS 相当陌生,并且遇到了当前的问题。

我的控制器中有以下内容

//Define the programs list table columns
    $scope.programListColumns = "[{ Name: 'Name'},{ Status: 'Status'},{ CreatedByUserName: 'Created By'},{ ModifiedDate: 'Modified'},{ ModifiedByUserName: 'Modified By'}]";

我想将其用作 html 中元素的列图,如下所示......

<table-helper datasource="programsList" columnmap="{{programListColumns}}"></table-helper>

我的指令非常广泛,但我基本上从我的数据源构建一个表,并使用我的列图映射我想要的数据,如果有意义,则为每个项目创建标题和行。

这是我的指令,缩写了一点......

(function(){
var app = angular.module("MdfAngularApp");
var tableHelper = function() {
    //Initiate variables for directive
    //var template = '<div class="tableHelper"></div>',
    var link = function(scope, element, attrs) {
            var headerCols = [],
                tableStart = '<table>',
                tableEnd = '</table>',
                table = '',
                visibleProps = [],
                sortCol = null,
                sortDir = 1;

            //Watch the datasource for changes.
            scope.$watchCollection('datasource', render);

            ... Functions go here ...
return {
        restrict: 'E',
        replace: true,
        scope: {
            columnmap: '@',
            datasource: '='
        },
        link: link,
    } 
};

app.directive('tableHelper', tableHelper);
}());

执行上述操作,我得到一个空字符串作为我的列图。

现在,如果我像这样放置我的html

<table-helper datasource="programsList" columnmap="[{ Name: 'Name'},{ Status: 'Status'},{ CreatedByUserName: 'Created By'},{ ModifiedDate: 'Modified'},{ ModifiedByUserName: 'Modified By'}]"></table-helper>

并将我的隔离范围列映射属性更改为“=”,一切都很好。我只是想比这更封装一点。

任何帮助将不胜感激。

angularjs using指令 isolate-scope

评论


答:

1赞 B.West 8/4/2016 #1

我的问题是我没有将我的列图解析为一个对象。一旦我这样做了,并提供了有效的json,我的解决方案就起作用了。