Définir une variable de portée angulaire dans le balisage

Question

Une question simple : Comment puis-je définir une valeur de portée en html, qui sera lue par mon contrôleur ?

var app = angular.module('app', []);

app.controller('MyController', function($scope) {
  console.log($scope.myVar);
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app'>
  <div ng-controller="MyController" app-myVar="test">
    {{myVar}}
  </div>
</div>

JSFiddle : http://jsfiddle.net/ncapito/YdQcX/

Answer 1

$scope.$watch('myVar', function (newValue, oldValue) {
        if (typeof (newValue) !== 'undefined') {
            $scope.someothervar= newValue;
//or get some data
            getData();
        }

    }, true);

La variable s'initialise après le contrôleur, vous devez donc la surveiller et lorsqu'elle n'est pas initialisée, l'utiliser.

Answer 2

Si vous n'êtes pas dans une boucle, vous pouvez utiliser ng-init sinon vous pouvez utiliser

{{var=foo;""}}

le "" permet de ne pas afficher votre var

Answer 3

J'aime la réponse mais je pense qu'il serait préférable que vous créiez une fonction de portée globale qui vous permettra de définir la variable de portée nécessaire.

Ainsi, dans le globalController, créez

$scope.setScopeVariable = function(variable, value){
    $scope[variable] = value;
}

et ensuite, dans votre fichier html, appelez-le

{{setScopeVariable('myVar', 'whatever')}}

Cela vous permettra d'utiliser $scope.myVar dans votre contrôleur respectif.

Answer 4

Vous pouvez utiliser la directive ng-value dans un champ caché comme ci-dessous :-.

<input type="hidden" ng-value="myScopeVar = someValue"/>

Ceci définira la valeur de la variable de portée (myScopeVar) à "someValue".