[英]AngularJS Proper way to pass variables
I would like to make them global so I can use [color]
and [shape]
throughout the whole script. 我想将它们设置为全局,以便可以在整个脚本中使用[color]
和[shape]
。 I will need each one to update independently but as I continue to add to the site I am going to need to use both together. 我将需要每个人独立更新,但是当我继续添加到站点时,我将需要同时使用两者。 Live preview 实时预览
$scope.shapeSelected = response.data[color][shape];
示例不起作用: $scope.shapeSelected = response.data[color][shape];
$scope.shapeSelected = response.data.blue[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');
});
}
}]);
You don't have to pass argument to your functions. 您不必将参数传递给函数。 if you defined ng-model="Color"
you can use $scope.Color
in your javascript code: 如果您定义了ng-model="Color"
,则可以在JavaScript代码中使用$scope.Color
:
change in html: 更改html:
ng-change="colorType()"
ng-change="shapeType()"
and js to: 和js可以:
$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];
});
}
If your question is about passing the variables or sharing the data properly across functions then this should help you. 如果您的问题是关于在各个函数之间传递变量或正确共享数据,那么这将为您提供帮助。
In your scenario. 在您的情况下。 As the ng-change
functions are assigned. 随着ng-change
功能的分配。
ng-change
function is triggered if you don't have a ng-model
try to save the new value that is the passed parameter in the $scope
so as to access it across all the other functions in that controller. 如果您没有ng-model
,则在触发ng-change
函数时,请尝试将作为传递参数的新值保存在$scope
以便跨该控制器中的所有其他函数访问它。 ng-model
declared for your element then just use the attribute for the ng-model as the reference variable . 如果您为元素声明了ng-model
,则只需将ng-model的属性用作参考变量。 eg: ng-model="xyz"
then $scope.xyz
would give you the desired value of the element. 例如: ng-model="xyz"
然后$scope.xyz
将为您提供所需的元素值。 This is how you can access the element value accordingly 这样可以相应地访问元素值
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.