从模板中的父作用域访问函数

时间:2017-03-15 15:39:11

标签: angularjs angularjs-directive

我正在尝试从父作用域访问一个函数,即使在看了很多关于这个的帖子时,我似乎无法找到我做错的事情。首先,我有一个页面,我可以这样调用ms-card指令:

<div ng-if="vm.isPhone ? ($index < 2) : ($index < 5)" flex="50" flex-xs="50" flex-sm="33" flex-md="25" flex-gt-md="20" ng-repeat="item in vm.OffersData[val.key]">
    <ms-card template="'app/main/offers/offer-card-template/offerCardTemplate.html'" ng-model="item" view-model="vm"></ms-card>
</div>

请记住,我发送的项目做得很好,它会向我展示那里的所有内容。现在这就是指令的样子:

(function () {
    'use strict';
    angular.module('app.core').directive('msCard', msCardDirective);
    /** @ngInject */
    function msCardDirective() {
        return {
            restrict: 'E'
            , scope: {
                templatePath: '=template'
                , card: '=ngModel'
                , vm: '=viewModel'
            }
            , template: '<div class="ms-card-content-wrapper" ng-include="templatePath" onload="cardTemplateLoaded()"></div>'
            , compile: function (tElement) {
                // Add class
                tElement.addClass('ms-card');
                return function postLink(scope, iElement) {
                    // Methods
                    scope.cardTemplateLoaded = cardTemplateLoaded;
                    //////////
                    /**
                     * Emit cardTemplateLoaded event
                     */
                    function cardTemplateLoaded() {
                        scope.$emit('msCard::cardTemplateLoaded', iElement);
                    }
                };
            }
        };
    }
})();

最后我试图像这样调用卡中的功能:

<div class="media" ng-click="vm.showDetailedOffer(card.shopkey, card.key)"> <img class="image" ng-src="{{card.img}}" fallback-src onload-src> </div>

非常感谢任何帮助

1 个答案:

答案 0 :(得分:0)

我犯的错误是在父控制器中(上面没有显示)。我将函数showDetailedOffer定义为:$ scope.showDetailedOffer = function。但它应该是vm.showDetailedOffer ..