AngularJS変数を渡す適切な方法

Question

グローバルとしたいので、スクリプト全体で[color]と[shape]を使用できます。私はそれぞれを独立して更新する必要がありますが、私がサイトに追加し続けると、私は両方を一緒に使う必要があります。 Live preview

• 例は動作しません：$scope.shapeSelected = response.data[color][shape];
• 例は、作業を行います。あなたはあなたの関数に引数を渡す必要はありません$scope.shapeSelected = response.data.blue[shape];

---

var app = angular.module("computer", ['ngRoute']) 

.config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
    when('/main', { 
     controller: 'MainCtrl' 
    }). 
    otherwise({ 
     redirectTo: '/main' 
    }) 
}]) 

.controller('MainCtrl', ['$scope', '$http', function($scope, $http) { 

    $scope.colorType = function(color) { 
     $http.get('stuff.json').then(function(response) { 
      $scope.colorSelected = response.data.type[color]; 

     }); 
    } 

    $scope.shapeType = function(shape) { 
     $http.get('shapes.json').then(function(response) { 
      $scope.shapeSelected = response.data[color][shape]; // <--- [color] is not getting pulled in on this function. 

      var resultsColorShape = $scope.shapeSelected; // <--- I would like to be able to store this incase i need it later. 
      console.log('resultsColorShape'); 
     }); 
    } 

}]); 

Answer 1

。 HTMLで

変更：

ng-change="colorType()" 

ng-change="shapeType()" 

とJSへ：あなたはng-model="Color"を定義した場合、あなたのjavascriptのコードで$scope.Colorを使用することができます

$scope.colorType = function() { 
$http.get('stuff.json').then(function(response) { 
    $scope.colorSelected = response.data.type[$scope.Color]; 

}); 
} 

$scope.shapeType = function() { 
    $http.get('shapes.json').then(function(response) { 
     $scope.shapeSelected = response.data[$scope.Color][$scope.Shape]; 
    }); 
} 

Answer 2

あなたの質問に変数を渡すか、共有についてです場合関数間でデータが適切に配置されていると、これが役立ちます。

ご使用のシナリオでは、 ng-changeの機能が割り当てられているため。あなたはそのコントローラに他のすべての機能を渡ってそれにアクセスするように$scopeで渡されたパラメータであり、新しい値を保存するng-model試みを持っていない場合ng-change機能がトリガされた

1. 。
2. 要素に対してng-modelが宣言されている場合は、ng-modelの属性を参照変数として使用してください。例えばng-model="xyz"の場合、$scope.xyzは要素の望ましい値を与えます。

これは私がちょうど$ scope.Colorと$ scope.Shapeとどちらの作品を使用してみましたので、あなたがplnkrデモにこれを追加することはできますが