angularjs - Establecer la variable de ámbito angular en el marcado

ng-bind

Question

Pregunta simple: ¿cómo puedo establecer un valor de alcance en html, para que lo lea mi controlador?

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

Crea una directiva llamada myVar con

scope : { myVar: ''@'' }

y llámalo así:

<div name="my_map" my-var="Richmond,VA">

Tenga en cuenta en particular la referencia de la caja de camello en la directiva del nombre de la etiqueta con guiones.

Para obtener más información, consulte "Comprensión de la transclusión y los ámbitos" aquí: - docs.angularjs.org/guide/directive

Aquí hay un violín que muestra cómo puede copiar valores de atributos a variables de ámbito de varias maneras diferentes dentro de una directiva.

Answer 2

Me gusta la respuesta, pero creo que sería mejor que creara una función de alcance global que le permita establecer la variable de ámbito necesaria.

Entonces en el GlobalController crea

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

y luego en tu archivo html llámalo

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

Esto le permitirá usar $ scope.myVar en su controlador respectivo

Answer 3

Puede establecer valores desde html como este. No creo que haya una solución directa desde angular todavía.

 <div style="visibility: hidden;">{{activeTitle=''home''}}</div>

Answer 4

Puede usar ng-init como se muestra a continuación

<div class="TotalForm">
  <label>B/W Print Total</label>
  <div ng-init="{{BWCount=(oMachineAccounts|sumByKey:''BWCOUNT'')}}">{{BWCount}}</div>
</div>
<div class="TotalForm">
  <label>Color Print Total</label>
  <div ng-init="{{ColorCount=(oMachineAccounts|sumByKey:''COLORCOUNT'')}}">{{ColorCount}}</div>
</div>

y luego usa la variable de ámbito local en otras secciones:

<div>Total: BW: {{BWCount}}</div>
<div>Total: COLOR: {{ColorCount}}</div>

Answer 5

Si no está en un bucle, puede usar ng-init, de lo contrario puede usar

{{var=foo;""}}

los "" alows no muestran tu var

Answer 6

ngInit puede ayudar a inicializar las variables.

<div ng-app=''app''>
    <div ng-controller="MyController" ng-init="myVar=''test''">
        {{myVar}}
    </div>
</div>

Ejemplo jsfiddle

Answer 7

ng-init no funciona cuando está asignando variables dentro del ciclo. Use {{myVariable=whatever;""}}

El final "" detiene la expresión angular que se evalúa en cualquier texto.

Luego, simplemente puede llamar a {{myVariable}} para generar su valor variable.

Encontré esto muy útil al iterar múltiples matrices anidadas y quería mantener mi información de iteración actual en una variable en lugar de consultarla varias veces.

Answer 8

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


    }, true);

La variable se inicializa después del controlador, por lo que debe vigilarlo y, cuando lo haya inicializado, usarlo.