Angular JS 1.6 - 在ng-view和custom指令之间共享对象

时间:2017-10-05 09:08:28

标签: angularjs angularjs-directive angularjs-scope

(我是AngularJS的新手)我正在为可重复使用的目的开发具有隔离范围的指令但是我想在ng-view中的自定义指令和自定义指令之间共享一个对象(“通知”) index.html的。如果没有路由,则在两个指令之间共享“已通知”,并且在底栏中未通知ng-view。

的index.html

  <div ng-view></div>
  <bottom-bar notified="notified" bottom-showing="showBottomBar(ntf)" class-to-choose="chooseClass(ntf)"></bottom-bar>

ng-view&gt; org.html

<org-list orgs = "orgs" notified="notified" name-filter="{{nameFilter}}" delete-orgs="deleteOrganization(organization)" add-org="addOrganization(organizationToAdd)" org-to-add="orgToAdd"></org-list>

org-list指令

organization
    .directive('orgList', function() {
        return {
            scope: {
                deleteOrgs: "&",
                addOrg: "&",
                orgs: "=orgs",
                orgToAdd: "=orgToAdd",
                notified: "=notified",
                nameFilter: "@"
            },
            controller: 'OrgListController',
            templateUrl: 'organization/org-list.template.html'
        };
});

底栏指令

bottom-bar
    .directive('bottomBar', function() {
        return {
            scope: {
                notified: "=notified",
                classToChoose: "&",
                bottomShowing: "&"
            },
            controller: 'BottomBarController',
            templateUrl: 'bottom-bar/bottom-bar.template.html'
        };
    });

底栏模板

<div id="bottom-bar" ng-show="showBottomBar({ntf:notified})" ng-class="chooseClass({ntf:notified})" role="alert">
    <strong>Text</strong> Text.
</div>

按钮控制器,功能

$scope.showBottomBar= function(notified){
    var ntf = notified["ntf"];
    console.log("showBottomBar() - notified: " + angular.toJson(ntf));    
    switch(ntf.value) {
        case 0:
            return false;
        case 1:
            return true;
        case 2:
            return true;
        default:
            return false;
    }
};

0 个答案:

没有答案