AngularJs - Как получить доступ к функции и модели контроллера в директиве - PullRequest
0 голосов
/ 24 апреля 2018

Привет, я много раз выполнял директивы, каждый раз, когда мне нужно связать каждое свойство, функцию и т. Д. Как это

app.directive('postJobWizard', function () {

return {
    restrict: 'EA',
    scope: {
        'artistSearchModel': "=",
        'showDropdown': "=",
        'operaticRoleSearchResult': "=",
        'viewAllJobs': "&",
        'getSingleJob':"&",
        'musicalWorkSearchResult': "=",
        'institutionSearchResult': "=",
        'changeTypeOfFilter': "&",
        'searchArtistJob': "&",
        'placeOfSearch':"@placeOfSearch",
        'artistFilterSearch':'=',
        'dropDownTitles':'=',
        'searchPlaceHolder':'@searchPlaceHolder',
        'isArtistOrAos':'=',
        'noResultFound' : '=',
        'oppurtunityOrBoard':'@',
        'oppurtunitiesOrBoards':'@',
        'showInfoIcon' : '=',
        'infoIconText' : '='
        },
    controller: function () { },
    controllerAs: '$postJob',
    bindToController: true,
    templateUrl: '/views/tss/directives/postJobWizard.html'
};

});

Но давайте предположим, что у меня 50 функций и 100 моделей, я должен написать каждую из них в scope. Есть ли какой-либо способ или лучшая практика, с помощью которой мы можем получить доступ к функциям и моделям родительского контроллера. Пожалуйста, объясните, будет ли это лучшей практикой?

Ответы [ 2 ]

0 голосов
/ 24 апреля 2018

Я сделал небольшой фрагмент, который, мы надеемся, поможет вам в правильном направлении.Также ознакомьтесь с этой ссылкой, чтобы узнать больше о директивах и о том, как работают области действия и контроллеры.

(function() {
	'use strict';
  
  angular.module('myApp', []);
  
  angular.module('myApp').controller('MyController', MyController);
  
  MyController.$inject = [];
  function MyController() {
  	var main = this;
    
    main.thisFunctionIsPublic = thisFunctionIsPublic;
    
  	function thisFunctionIsPublic() {
    	return 'This text comes straight from the parent controller!';
    }
  
  	function thisFunctionIsPrivate() {
    	return 'private!';
    }
  }
  
  angular.module('myApp').directive('myDirective', function() {
  	return {
    	restrict: 'E',
      scope: false,
      controllerAs: '$controller',
      //bindToController: true,
      template: '<p>Public function: {{$controller.parentController.thisFunctionIsPublic()}}</p><p>Private function: {{$controller.parentController.thisFunctionIsPrivate()}}</p>',
      controller: function($element) {
      	this.parentController = $element.parent().controller();
        console.log(this.parentController);
      }
    };
  });
  
}());
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
  <div ng-controller="MyController as main">
    <my-directive></my-directive>
  </div>
</body>

ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ: Я не думаю, что это лучшая практика, так как я считаю, что директивы в основном должны быть отдельными частями кода, которые должны бытьвозможность работать независимо от того, что находится на родительском контроллере, но именно так я бы получил доступ к родительскому контроллеру, если бы мне ОЧЕНЬ нужно было.

0 голосов
/ 24 апреля 2018

введите постоянную как это:

app
.constant('scopeSettings',{your scope object goes here (probably on a seperate file)})
.directive('postJobWizard', function (scopeSettings) {

return {
    restrict: 'EA',
    scope: scopeSettings,
    controller: function () { },
    controllerAs: '$postJob',
    bindToController: true,
    templateUrl: '/views/tss/directives/postJobWizard.html'
  };
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...