Question

我目前有三个相同类型的组件。例如，我有一个名为'Lister'的组件，我有三个Lister组件，它们调用不同的apis（例如列出教师，学生和课程）。但是，如果加载课程的组件想要从呈现教师的组件访问数据，那么我该怎么办？我看到的方法很少，但它们都与在其他类型的组件之间共享信息有关（通过$ scope和$ rootScope）。

  <lister data-ng-cloak api="/teacher" type="teacher"></lister>
  <lister data-ng-cloak api="/student" type="student"></lister>
  <lister data-ng-cloak api="/course" type="course"></lister>

这是使用三个组件的当前方式。他们共享共同的控制器和服务。

Answer 1

在您的情况下，API可能会有所不同，但它们有一个共同的控制器和服务。因此，声明三个数组来存储教师，学生和课程。

app.service('myService', function{
    vm = this;
    vm.teachers = [];
    vm.students = [];
    vm.courses = [];
});

有api调用来获取数据。

vm.getApiData = $http.get(url).then(); // url may be to get above three from api

有一个服务功能，可以将列表输入控制器

vm.getData: function(val){
   return vm[val]; // value may be teachers, students and courses
}

从控制器调用上述功能。

$scope.teachers = myService.getData('teachers');
$scope.students= myService.getData('students');
$scope.courses= myService.getData('courses');

现在，数据准备就绪。只需根据您的要求访问它。只是一个想法

Answer 2

在控制器中创建父对象

android:layout_above="@id/footerView"

然后，所有列表都会从此父对象中分配值，以便将所有数据绑定到一个公共对象。例如：var parent={};

然后他们都在共享来自一个共同对象的数据

Answer 3

在您的控制器中创建一个名为lister的对象，该对象具有每个不同组件的属性：

$scope.lister = {
    "teacherView": "teacher",
    "studentView": "student",
    "courseView": "course",
}

当你调用setData方法时，接收要存储的数据和密钥，让我们说

componentService.setData(data, lister.teacherView)

并更新您的getData，以便您可以选择要获得的数据：

componentService.getData(lister.teacherView)

您可以像这样创建service：

angular.module('app').service('componentService', function() {
    var d = {};
    function setData(data, key){
        d[key] = data;
    }

    function getData(key){
        return d[key];
    }
})

在Angular.js 1

3 个答案: