Je suis nouveau dans angularjs, je sais que $scope
représente une connexion entre le contrôleur et la vue. Mais existe-t-il un moyen en plus de rechercher class="ng-scope"
pour obtenir l'élément scope?
function someControllerFunc($scope){
$scope.element;
}
Je sais que le même contrôleur peut être affecté à plusieurs portées. Cela n’est donc peut-être pas possible.
Vous pouvez transmettre l'élément au contrôleur, tout comme la portée:
function someControllerFunc($scope, $element){
}
$element
est l'une des quatre sections locales que $compileProvider
donne à $controllerProvider
, puis à $injector
. L'injecteur injecte des variables locales dans la fonction de votre contrôleur uniquement si cela vous est demandé.
Les quatre sections locales sont:
$scope
$element
$attrs
$transclude
La documentation officielle: Référence d'API de service Compile AngularJS $ - contrôleur
Le code source de Github angular.js/compile.js :
function setupControllers($element, attrs, transcludeFn, controllerDirectives, isolateScope, scope) {
var elementControllers = createMap();
for (var controllerKey in controllerDirectives) {
var directive = controllerDirectives[controllerKey];
var locals = {
$scope: directive === newIsolateScopeDirective || directive.$$isolateScope ? isolateScope : scope,
$element: $element,
$attrs: attrs,
$transclude: transcludeFn
};
var controller = directive.controller;
if (controller == '@') {
controller = attrs[directive.name];
}
var controllerInstance = $controller(controller, locals, true, directive.controllerAs);
Je ne sais pas ce que vous entendez exactement, mais j'espère que cela vous aidera.
par cette directive, vous pouvez accéder à l'élément DOM à l'intérieur du contrôleur
Ceci est un exemple qui vous aide à focaliser un élément dans le contrôleur
.directive('scopeElement', function () {
return {
restrict:"A", // E-Element A-Attribute C-Class M-Comments
replace: false,
link: function($scope, elem, attrs) {
$scope[attrs.scopeElement] = elem[0];
}
};
})
maintenant, en HTML
<input scope-element="txtMessage" >
puis, à l'intérieur du contrôleur:
.controller('messageController', ['$scope', function ($scope) {
$scope.txtMessage.focus();
}])
Créer une directive personnalisée
masterApp.directive('ngRenderCallback', function() {
return {
restrict: "A",
link: function ($scope, element, attrs) {
setTimeout(function(){
$scope[attrs.ngEl] = element[0];
$scope.$eval(attrs.ngRenderCallback);
}, 30);
}
}
});
code pour le modèle HTML
<div ng-render-callback="fnRenderCarousel('carouselA')" ng-el="carouselA"></div>
fonction dans le contrôleur
$scope.fnRenderCarousel = function(elName){
$($scope[elName]).carousel();
}