zoukankan      html  css  js  c++  java
  • AngularJS中使用$parse或$eval在运行时对Scope变量赋值

    在"AngularJS中自定义有关一个表格的Directive"中自定义了一个有关表格的Direcitve,其表格的表现方式是这样的:

    <table-helper datasource="customers" clumnmap="[{name: 'Name'}, {street: 'Street'}, {age: 'Age'}, {url: 'URL', hidden: true}]"></table-helper>

    以上,变量colmnmap的值是事先定义在了Scope中的:

    return {
        restrict: 'E',
        scope: {
            columnmap: '=',
            datasource: '='
        },
        link:link,
        template:template
    };

    AngularJS中,还有一种运行时给Scope变量赋值的办法,那就是在link函数中使用$parse或$eval方法

    在Direcitve的呈现方面和以前一致:

    <table-helper-with-parse datasource="customers" columnmap="[{name: 'Name'},...]"></table-helper-with-parse>

    Directive大致是这样:

    var tableHelperWithParse = function($parse){
        var template = "",
        link = function(scope, element, attrs){
            var headerCols = [],
                tableStart = '<table>',
                tableEnd = '</table>',
                table = '',
                visibleProps = [],
                sortCol = null,
                sortDir = 1,
                columnmap = null;
    
                $scope.$watchCollection('datasource', render);
                
                //运行时赋值columnmap
                columnmap = scope.$eval(attrs.columnmap);
                
                //或者
                columnmap = $parse(attrs.columnmap)();
    
                wireEvents();
    
                function rener(){
                    if(scope.datasource && scope.datasourse.length){
                        table += tableStart;
                        table += renderHeader();
                        table += renderRows() + tableEnd;
                        renderTable();
                    }
                }
        };
        
        return {
            restrict: 'E',
            scope: {
                datasource: '='
            },
            link: link,
            template: template
        }
    
    }
    
    
    angular.module('direcitvesModule')
        .directive('tableHelperWithParse', tableHelperWithParse);
  • 相关阅读:
    日记
    没有起得晚的周末,希望今天能做一些什么
    怎么就这么喜欢测软件呢?—— Google Calendar农历问题
    Sharepoint带自定义属性的FieldType
    自己使用Outlook 2003 的一些小技巧
    Xml名称空间
    c# jingtailei 静态成员
    select count
    varchar nvarchar(转)
    linq 笔记(1)
  • 原文地址:https://www.cnblogs.com/darrenji/p/5156650.html
Copyright © 2011-2022 走看看