2017-06-30 1 views
0

Je réussi à générer et importer un code html commevaleurs d'entrée d'accès angulaire JS à base de modèle ng stocké dans une chaîne

<input type="text" ng-model="text1"> 
<input type="text" ng-model="text2"> 

et moi avons obtenu un tableau de chaînes contenant les modèles ng-de toutes ces entrées en un tableau à partir d'une demande $http.post comme

$scope.ngmods=['text1','text2'] 

comment puis-je obtenir les valeurs des entrées en manipulant les éléments du tableau?

Voici ce que j'ai essayé:

{{ {{ngmods[0]}} }} 

comme je l'ai essayé d'obtenir la valeur dans l'élément de tableau, puis l'enferma de nouveau dans les {{ }} espère que les résultats seraient les mêmes que {{text1}}

Répondre

2

utilisez $parse pour évaluer l'expression par rapport à la portée. créer un filtre personnalisé avec $parse pour obtenir la valeur de portée d'une chaîne

.filter('parserFil',function($parse){ 
    return function(item,scope){ 
     return $parse(item)(scope); 
    } 
}) 

dans le code HTML passe la portée actuelle this du html pour filtrer

{{ngmods[0] | parserFil : this}} 

angular.module("app",[]) 
 
.controller("ctrl",function($scope,$parse){ 
 

 
    $scope.ngmods=['text1','text2']; 
 
    
 
    
 
}) 
 
.filter('parserFil',function($parse){ 
 
    return function(item,scope){ 
 
     return $parse(item)(scope); 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
<input type="text" ng-model="text1"> 
 
<input type="text" ng-model="text2"> 
 
    
 
{{ngmods[0] | parserFil : this}} 
 
    
 
</div>

+0

Je vois que cela fonctionne sur un débordement de pile, mais pas quand je l'intégrer dans mon code. Il n'affiche rien :(J'utilise v1.6. ^. Pensez qu'il pourrait être «cos de lui? Merci! –

+0

Pouvez-vous créer un plnkr –

0

angular.module('todoApp', []) 
 
    .controller('TodoListController', ["$scope", 
 
    function($scope) { 
 
    $scope.setValue = setValue; 
 
    function setValue() { 
 
     var list = []; 
 
     list.push($scope.text1); 
 
     list.push($scope.text2); 
 
     $scope.ngmods = list; 
 
    } 
 
    }]);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="todoApp"> 
 
<div ng-controller = "TodoListController"> 
 
<input type="text" ng-model="text1"> 
 
<input type="text" ng-model="text2" ng-blur="setValue();"> 
 
<span>{{ngmods[0]}}</span> 
 
</div> 
 
</div>

0

Utilisez ng-repeat & assurez-vous que sous HTML dans ng-contrôleur Exemple

<html> 
<body ng-app="myApp" ng-controller="myCtrl"> 
<h1 ng-repeat="x in records">{{x}}</h1> 
<script>enter code here 
var app = angular.module("myApp", []); 
app.controller("myCtrl", function($scope) { 
    $scope.records = [ 
    "Amar", 
    "Mhatre" 
    ] 
}); 
</script> 
</body> 
</html>