Question

原谅我的英语不好！我尽力说出我的问题。我想在指令中使用控制器的功能。我知道这个问题已经讨论过很多次了。我把这个问题作为参考。 here !。但我的问题与他们的问题略有不同。图像如下：，在html中，我在右边有一个光滑的边框，由指令创建。如果在光滑的边框中单击按钮，它将触发该功能。它不起作用，所以我创建了三个html中的按钮就像在光滑的边框（代码如下），然后按钮工作！所以我认为范围范围引起了问题！但我不知道如何解决它，任何人都可以帮助我吗？ THX

任何描述性模糊，请告诉我，谢谢！

以下是我的代码：

1.app.js代码

var MakeApp = angular
  .module('newApp', [
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ngRoute',
    'ngSanitize',
    'ngTouch',
    'ui.bootstrap'
  ])
  .config(function ($routeProvider) {
      $routeProvider
        .when('/', {
            templateUrl: '/dashboard/dashboard.html',
            controller: 'dashboardCtrl',
            cache: false,
        })
        .when('/ui-property', {
            templateUrl: 'property/property_list.html',
            controller: 'propertylistCtrl',
            cache: false,
        })



  MakeApp.directive('generalFilter', ['$compile','$location','builderService', function($compile, $location,builderService) {
        return {
            restrict: 'C',
            link: function(scope, element, attrs) {
                scope.$location = $location;
                var template = "";
                scope.$watch('$location.path()', function(locationPath) {
                    element.removeClass("hidden");
                    switch (locationPath) {
                        case '/ui-brand':
                            template = '<a class="builder-toggle"><i class="icon-wrench"></i></a>' + 
                                       '<div class="inner">' +
                                       '<div class="builder-container"><brandlistfilter>1 this is for sam test</brandlistfilter></div></div>';
                            break;

                        case '/ui-property':
                            template = 
                                       '<a class="builder-toggle"><i class="icon-wrench"></i></a>' + 
                                       '<div class="inner">' +
                                       '<div test-dir call-fuc="test()" withparam="param(name)" testing="testing(msg)"></div>'
                            break;
                        default:
                            element.addClass('hidden');
                    }
                    element[0].innerHTML = template;
                    $compile(element.contents())(scope);

                });
            },
        };
    }]);

2.propertylistCtrl.js代码：

'use strict';
var result
var propertylistmodule = angular.module('newApp');

propertylistmodule.controller("propertylistCtrl", function ($scope) {
  $scope.test = function () {
   alert("Hi you called ctrl function");
  };
    $scope.param = function(name){
  alert("My name is " + name);
  }
  $scope.testing = function(role){
  alert("I'm a "+ role);
  }
});
propertylistmodule.directive("testDir", function () {
  return {
    scope: {
      test: "&callFuc",
      param:"&withparam",
      testing:"&"
    },
    template: 
    '</br></br></br></br></br>'+`<button ng-click="test()">Call Test!
               </button>
               <button ng-click="param({name:'Mani'})">With param!
               </button>
               <button ng-click="clickHere()">Click Me!
               </button>`,
    link:function(scope){
        scope.clickHere = function(){
            scope.testing({msg:"Javascript Developer"});
        };
    }
  };
});

property_list.html代码：

 <div>
  <div test-dir call-fuc="test()" withparam="param(name)" testing="testing(msg)"></div>
</div>

我提前感谢

在Directive中使用Controller函数/变量，不起作用

0 个答案: