ng-model non funziona all'interno di ng-include

Sono un principiante in angularjs e attualmente sto affrontando un problema con ng-include.ng-model non funziona all'interno di ng-include

Ho un'applicazione di test che utilizza partial. Ecco il mio codice.

<html ng-app ="TextboxExample"> 
    <head> 
     <title>Settings</title> 
     <script src="angular.js"></script> 
    </head> 

    <body ng-controller="ExampleController"> 
     <div ng-include src = "'view.html'"></div> 
     <script> 
      angular.module('TextboxExample', []) 
      .controller('ExampleController', ['$scope', function($scope) { 
       $scope.textboxVal = 'fddfd'; 

       $scope.ReadGeneralSettings = function() { 
       alert($scope.textboxVal); 
       } 
       $scope.ResetGeneralSettings = function() { 

       $scope.textboxVal = 'fddfd'; 
       } 

      }]); 
     </script> 
     <button class="pull-right" ng-click = "ReadGeneralSettings()">Read</button> 
     <button class="pull-right" ng-click = "ResetGeneralSettings()">Cancel</button> 



    </body> 
</html>

Il codice view.html parziale è

<input type="text" ng-model="textboxVal">

Per qualche ragione, textboxVal impostato ng-modello non viene aggiornato quando entro il valore nella casella di testo. Ma questo funziona bene se non utilizzo ng-include e aggiungo direttamente il contenuto di view.html nel file html principale. Per favore aiuto.

Grazie Sunil

fonte

2015-09-25 Sunil Raj

ng-include crea un nuovo ambito –

ok, quindi posso farlo funzionare? –

Controlla la mia risposta qui sotto –

Usa $ genitore per accedere al campo di applicazione del controllo

Demo

<input type="text" ng-model="$parent.textboxVal">

fonte

2015-09-25 06:07:08

Il problema è che ngInclude crea nuovo ambito, in modo che il modello si definisce all'interno del modello parziale con ngModel opere con valore ambito locale e esterno ExampleController non può vederlo.

La semplice soluzione è quella di utilizzare catena prototipo di oggetti scope, quindi portata interno erediterà e utilizzare valore del modello dall'ambito esterno:

<body ng-controller="ExampleController"> 
    <div ng-include src = "'view.html'"></div> 
    <script> 
     angular.module('TextboxExample', []) 
     .controller('ExampleController', ['$scope', function($scope) { 
      $scope.model.textboxVal = 'fddfd'; 

      $scope.ReadGeneralSettings = function() { 
      alert($scope.model.textboxVal); 
      } 
      $scope.ResetGeneralSettings = function() { 
      $scope.model.textboxVal = 'fddfd'; 
      } 

     }]); 
    </script> 
    <button class="pull-right" ng-click = "ReadGeneralSettings()">Read</button> 
    <button class="pull-right" ng-click = "ResetGeneralSettings()">Cancel</button> 

</body>

e quindi utilizzare in parziale

<input type="text" ng-model="model.textboxVal">

fonte

2015-09-25 05:39:28 dfsq

ng-model non funziona all'interno di ng-include

risposta

Problemi correlati