Estoy tratando de enlazar el valor de un campo de entrada a una variable.
No sé el nombre de esta variable a priori; se almacena en otra variable.

Este es el html:

<body ng-controller="stageController">
    <form name="myForm" novalidate="">
        <input type="text" name="myText" ng-model="model" />
    </form>
</body>

y este es el controlador:

function stageController($scope) {
    $scope.model = 'realModel'; //contains the name of the variable that i would bind to the field 
    $scope.realModel = 'initial value of the field';
}

Hice también un el violín.

Esto no funciona porque en la actualidad la unión entre el campo de entrada y la model variable. En lugar de eso me gustaría enlazar el campo de entrada para la variable cuyo nombre se almacena en el interior de la $scope.model variable (en este caso realModel).

Es posible? Cómo?

OriginalEl autor Bruno | 2013-04-12

6 Comentarios

  1. 19

    Sí, es posible. Yo no entiendo por qué te gustaría hacerlo, pero puedo mostrarle cómo. Yo no podía iniciar el violín, pero he copiado a un plnkr: http://plnkr.co/edit/o1gFf1lMq4Pg5iVoVyUN?p=preview

    Crear una directiva que transformar la plantilla original en uno nuevo con $compilar. La nueva directiva:

    directive('ngBindModel',function($compile){
        return{
            compile:function(tEl,tAtr){
              tEl[0].removeAttribute('ng-bind-model')
                return function(scope){
                  tEl[0].setAttribute('ng-model',scope.$eval(tAtr.ngBindModel))
                  $compile(tEl[0])(scope)
                    console.info('new compiled element:',tEl[0])
                }
            }
        }
    })

    Actualizado html (cambio de gn-modelo ng-bind-modelo, la nueva directiva)

    <input type="text" name="myText" ng-bind-model="model"  />
    +1 no es suficiente para que esta respuesta… muchas Gracias
    la creación de una directiva llamada ngXxx es una mala práctica ( «no prefijo sus propias directivas con ng o pueden entrar en conflicto con las directrices incluidas en una versión futura de Angular» – doc )

    OriginalEl autor

  2. 13

    Una alternativa más sencilla, siempre que es posible cambiar el modelo de un poco de HTML:

    <body ng-controller="stageController">
        <form name="myForm" novalidate="">
            <input type="text" name="myText" ng-model="vars[model]" />
        </form>
    </body>

    Modelo:

    function stageController($scope) {
        $scope.model = 'realModel'; //contains the name of the variable that i would bind   to the field 
        $scope.vars = {};    //variables container
        $scope.vars.realModel = 'initial value of the field';
    }
    mejor respuesta IMO
    Esto significa que todas las variables deben ser dentro de vars sin embargo, que algo chupa
    no se trabaja con el siguiente nivel de la propiedad si intenta utilizar como esto <cuerpo ng-controller=»stageController»> <form name=»miformulario» novalidate=»»> <input type=»text» name=»mitexto» ng-model=»vars[modelo]» /> </form> </body> función stageController($scope) { $scope.modelo = ‘realModel.innerRealModel’; $scope.vars = {}; // variables contenedor $scope.vars.realModel = {}; $scope.vars.realModel.innerRealModel = ‘valor inicial del campo’; }

    OriginalEl autor MiMo

  3. 9

    Traté de usar la respuesta anterior dentro de ng-repeat y no funcionó. Utiliza el compile función, lo que significa que todas las directivas que utiliza la última vez que pasaron en valor. Si utiliza la función de enlace parece que funciona como se espera, es decir,

    .directive('ngBindModel',function($compile){
          return{
            link:function(scope,element,attr){
              element[0].removeAttribute('ng-bind-model');
              element[0].setAttribute('ng-model',scope.$eval(attr.ngBindModel));
              $compile(element[0])(scope);
            }
          };
        })

    OriginalEl autor Cris Ward

  4. 4

    La (actualmente ganar) responder por user2273266 es en realidad sutilmente incorrecta. Mientras que si sólo vas a usar la directiva una vez, que en realidad se confunde la plantilla de elemento de instancia y el elemento de objetos, y se puso el apellido se encuentra en TODOS los elementos se hace dentro de un bucle, por ejemplo.

    directive('custBindModel',function($compile){
        return{
            compile:function(tEl){
                tEl[0].removeAttribute('cust-bind-model');
                return function(scope, iEl, iAtr){
                    iEl[0].setAttribute('ng-model',scope.$eval(iAtr.custBindModel));
                    $compile(iEl[0])(scope);
                    console.info('new compiled element:',tEl[0]);
                }
            }
        }
    })

    Esta versión corrige el problema por la separación de las operaciones en la plantilla y de la instancia, por lo que el post-llamada al vínculo sólo modifica la instancia y no a la plantilla.

    También se ha cambiado el ‘ng’ prefijo que es reservada.

    OriginalEl autor mr_minty_magoo

  5. 0

    Yo soy relativamente nuevo en Angularjs. Sé lo que estás pidiendo es posible en Javascript usando la ventana. No estoy seguro acerca de Angular. He modificado el código para lograr una cerca posible solución:

     $scope.model = {'var':'realModel','value':'initial value of the field'};

    Probar el el violín:

    Esto no se ajusta a mi caso, debido a que están asumiendo sé que la variable que quiero enlazar con el campo es el modelo.valor… en cambio yo no sé el nombre de la variable… todo lo que sé es que su nombre se almacena en el modelo.var (con referencia a su código).

    OriginalEl autor Bhumi Singhal

  6. -1

    Lo que falta aquí es el ng-app de la directiva, no es necesario el uso explícito de las directrices para ng-model.

    Esto funciona:

    <body ng-app="myApp" ng-controller="stageController">
        <form name="myForm" novalidate="">
            <input type="text" name="myText" ng-model="realModel" />
        </form>
    <script>
    var app = angular.module('myApp', []);
    app.controller('stageController', function($scope) {
        $scope.model = 'realModel'; 
        $scope.realModel = 'initial value of the field';
    })
    </script>
    </body>

    OriginalEl autor Shashi Gupta

Dejar respuesta

Please enter your comment!
Please enter your name here