Question

当我在我的投资组合中选择一个项目时，我有路由/portfolio/:workName。在我的控制器中，我想将$scope.work设置为我根据workName选择的项目。这就是我到目前为止所拥有的：

app.factory('Works', function(){

var Works = {}

Works.projects =[
    {
        name : "ProjectOne",
        string : "stuff",
    {
        name : "ProjectTwo",
        string : "more stuff",
    },
    {
        name : "ProjectThree",
        string : "stuff",
    }
];  

Works.findByName = function(name) {
    Works.projects.forEach(function(work) { 
        if(work.name == name) {
            return work;
        }
    });
}
return Works;
})

app.controller("ProjectController", function ($scope, Works, $routeParams) {
$scope.work = Works.findByName($routeParams.workName);
});

但是，在调试器中，尽管$routeParams.workName返回＆＃34; ProjectOne＆＃34;，Works.findByName($routeParams.workName)返回undefined。

Answer 1

您的代码问题是forEach为not returning a value（您不会以findByName方法和the return value of forEach is undefined返回结果，而只是执行比较。您可以按照以下方法修改方法，或使用filter()方法（Works.findByNameUsingFilter示例）：

angular.module('myApp', [])
.factory('Works', [function(){
    var Works = {};
    Works.projects = [
        {
            name: "ProjectOne",
            string: "stuff1"
        },
        {
            name : "ProjectTwo",
            string : "more stuff",
        },
        {
            name : "ProjectThree",
            string : "stuff",
        }
    ];

    Works.findByName = function(name) {
        var res = '';
        Works.projects.forEach(function(work) {
            if(work.name === name) {
                res = work;
            }
        });    
        return res;
    };
    
    Works.findByNameUsingFilter = function(name) {
        return Works.projects.filter(function(work) {
            return work.name === name;
        });    
    };

    return Works;
}])
.controller("ProjectController", ['$scope', 'Works', function ($scope, Works) {
    $scope.workUsingFindByName = Works.findByName("ProjectOne");
    $scope.workUsingFindByNameUsingFilter = Works.findByNameUsingFilter("ProjectThree");
}]);

<script src="//code.angularjs.org/1.6.2/angular.js"></script>

<div ng-app="myApp">
  <div ng-controller="ProjectController">   
  {{workUsingFindByName.string}}
  <br/>
  {{workUsingFindByNameUsingFilter[0]}}
  </div>
</div>

Answer 2

这些是代码中的错误：

'{'缺少Works.projects。
使用过滤器代替forEach或map
您没有正确返回值。正确检查代码段：

var Works = {};
Works.projects =[
    {
        name : "ProjectOne",
        string : "stuff"
    },
    {
        name : "ProjectTwo",
        string : "more stuff"
    },
    {
        name : "ProjectThree",
        string : "stuff"
    }
];  

Works.findByName = function(name) {
   //ES5 Syntax
   return  Works.projects.filter(function(work) { 
        if(work.name == name) {
            return work;
        }
    });
   
     //ES6 Syntax
    //return Works.projects.filter(work => (work.name == name));
}



console.log(Works.findByName('ProjectThree'))

Answer 3

检查代码，将Works.findByName更改为无效的函数。

app.factory('Works', function(){

var Works = {}

Works.projects =[
    {
        name : "ProjectOne",
        string : "stuff",
    {
        name : "ProjectTwo",
        string : "more stuff",
    },
    {
        name : "ProjectThree",
        string : "stuff",
    }
];  

var findByName = function(name) {
    Works.projects.forEach(function(work) { 
        if(work.name == name) {
            return work;
        }
    });
}
return {findByName: findByName};

});

app.controller("ProjectController", function ($scope, Works, $routeParams) {
$scope.work = Works.findByName($routeParams.workName);
});

在Angular Factory获取元素

3 个答案: