Javascript 当给一个作用域分配不同的值时，只需调用一个

我第一次尝试用AngularJS写作，但我根本不是开发人员。 我刚开始编程

这是我的问题； 我想在

var ouinon

中为

$scope.colors

分配前台用户输入的选定颜色值

当然，放置

$scope.colors.name

不起作用。。。（在console.log中，它是“未定义的”）

你可能觉得这很容易，但我不知道我做错了什么

JS部分：

function LookCtrl($scope, $http){

    $scope.colors = [
        {name:'blue', shade:'femme'},
        {name:'red', shade:'femme'},
        {name:'yellow', shade:'femme'},
        {name:'blue', shade:'homme'},
        {name:'red', shade:'homme'}
    ];

    $scope.myColor = $scope.colors[2];  

    var ouinon = "http://api.shopstyle.fr/api/products?pid=uid7689-25635133-51&cat="
        + $scope.colors.name + "&limit=60&fl=d0&sort=Popular";

    $http.get(ouinon).success(function(data){
        $scope.look = data;
    });

HTML部分：

<section ng-controller="LookCtrl" ng-init="init()" class="panel panel-padding left" 
    ng-class="{center:panel==1, right:panel<1}">
    <h1>Selection: </h1>
    <select ng-model="myColor" 
        ng-options="color.name group by color.shade for color in colors">
    </select>

选择：

简单地说，$scope.colors是一个数组，$scope.colors.name是错误的语法，如果您写错了，您应该使用$scope.MyColor.name

试试这个吧，兄弟

控制器

$scope.colors = [
           { name: 'blue', shade: 'femme' },
           { name: 'red', shade: 'femme' },
           { name: 'yellow', shade: 'femme' },
           { name: 'blue', shade: 'homme' },
           { name: 'red', shade: 'homme' }
    ];

    $scope.LookCtrl = function() {

        var ouinon = "http://api.shopstyle.fr/api/products?pid=uid7689-25635133-51&cat="
            + $scope.myColor + "&limit=60&fl=d0&sort=Popular";

        $http.get(ouinon).success(function (data) {
            $scope.look = data;
        });
    };

HTML

<select ng-model="myColor" ng-options="color.name for color in colors" ng-change="LookCtrl()">
</select>

这只是一个基于您的问题的示例，但我不知道您在哪里使用了

$scope.look

，但在我的示例中，它包含来自请求的一些数据

我希望它能帮助你

我让我的

$scope.colors

在函数外部声明（但显然在控制器内部），这样当

select

被更改时，调用api的函数被触发

进一步的问题，只要问我，我愿意回答你的问题，你就快到了

您的

$scope.MyColor

已绑定到所选颜色

您可以使用

$scope.MyColor.name

获取名称

另外，我认为您编写控制器的方式不正确。看起来您试图实现的是调用Ajax来获取一些数据，但是获取数据的触发器是什么呢？如果它基于选择更改的时间，则应按如下方式编写控制器：

.controller("LookCtrl", ["$scope", "$http", function ($scope, $http){

    $scope.colors = [
        {name:'blue', shade:'femme'},
        {name:'red', shade:'femme'},
        {name:'yellow', shade:'femme'},
        {name:'blue', shade:'homme'},
        {name:'red', shade:'homme'}
    ];

    $scope.myColor = $scope.colors[2]; // default selection

    $scope.onChange = function(){
        var ouinon = "http://api.shopstyle.fr/api/products?pid=uid7689-25635133-51&cat="
        + $scope.MyColor.name + "&limit=60&fl=d0&sort=Popular";

        $http.get(ouinon).success(function(data){
           $scope.look = data;
           $scope.$apply(); // this is needed since it's an async call
        }
    };

}]);

然后HTML：

<section ng-controller="LookCtrl" ng-init="init()" class="panel panel-padding left" 
    ng-class="{center:panel==1, right:panel<1}">
    <h1>Selection: </h1>
    <select ng-model="myColor" ng-change="onChange()"
        ng-options="color.name group by color.shade for color in colors">
    </select>
</section>

选择：

您好，新开发人员，您的代码适合我。谢谢你扣动扳机，我还没想过呢：）