AngularJS:调用嵌套控制器中的JSON数组值

AngularJS: Call JSON array value in nested Controller

本文关键字:JSON 数组 控制器 调用 嵌套 AngularJS      更新时间:2023-09-26

如何在其他控制器中调用Json数组值。基本上,我使用嵌套控制器。嵌套的控制器将返回firstname和lastname的第一个字符。

例如,如果我的名字是Anand Jee,那么它会返回AJ,Rohan Kumar,然后它会返回RK。

我的AngularJS代码。

//create module
var myApp = angular.module("myApp", []);
//create controller
myApp.controller("empCtrl", function ($scope) {
    var Employees = [
        { FirstName: "Anand", LastName: "Jee", Roles: "Web Developer", Technology: ".NET" },
        { FirstName: "Pritus", LastName: "Dubey", Roles: "Window App Developer", Technology: "XAMARIN" },
        { FirstName: "Vineet", LastName: "Rai", Roles: "Web Developer", Technology: ".NET" },
        { FirstName: "Nilesh", LastName: "Pathak", Roles: "UI/UX Developer", Technology: "Photoshop" },
        { FirstName: "Vikesh", LastName: "Juyal", Roles: "Web Developer", Technology: "PHP" }
    ];
    $scope.Employees = Employees;
});
myApp.controller("EmpShortName", function ($scope) {
    $scope.getEmpShortName = function () {
        //$scope.empShortName  = $scope.Employees.FirstName + " " + $scope.Employees.LastName;//here is problem
        $scope.empShortName = "NP";//For temp declaration
        return $scope.empShortName;
    };
});

柱塞演示

Employee对象传递到getEmpShortName函数中。然后只返回解析后的值。此外,不需要EmpShortName控制器,只需将scope函数放在empCtrl控制器中即可:

HTML:

<div class="empTextImage">{{getEmpShortName(emp)}}</div>

JS:

$scope.getEmpShortName = function (emp) {
    return emp.FirstName.substr(0,1) + emp.LastName.substr(0,1);
};

更新的Plunker