在angularJS中使用模态窗口时，在控制器之间共享对象数组

Sharing object array between controllers while working with modal window in angularJS

本文关键字：控制器 之间 共享 数组 对象 窗口 angularJS 模态      更新时间：2023-09-26

我正在尝试使用一个对象数组，该数组在两个控制器之间共享，其中一个控制器处理模式窗口。

这是js代码。

angular.module('MyApp', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache', 'ui.bootstrap'])
  .service('Faq', function ($http) {
    this.faqList = [];
    this.faqList = $http.get('/Json/faq.json');
    this.getFaqs = function ()
    {
        return this.faqList;
    }
    this.addfaq = function (obj) {
        this.faqList.push(obj);
    };

})
.controller('AppCtrl', function ($scope,$modal,Faq) {

    $scope.faqData = [];
    Faq.getFaqs().then(function (msg) {
        $scope.faqData = msg.data;
    });
    }
    $scope.show = function () {
        $modal.open({
            templateUrl: "faqAddUpdate.html",
            controller: "faqctrl"
        });
    };

})
.controller('faqctrl', function ($scope, $modalInstance, Faq) {
    $scope.question = '';
    $scope.id = '';
    $scope.answer = '';
    $scope.editFaq = function (id) {
        $scope.divFaq = true;
        $scope.faqs = [];
        Faq.getData().then(function (msg) {
            $scope.faqs = msg.data;
            var l = $scope.faqs.length;
            for (var i = 0; i < l; i++) {
                if ($scope.faqs[i].id == id) {
                    $scope.question = $scope.faqs[i].question;
                    $scope.id = $scope.faqs[i].id;
                    $scope.answer = $scope.faqs[i].answer;
                }
            }
        });
    };

    $scope.AddUpdateFAQ = function () {
        var faq = {
            id: $scope.id,
            question: $scope.question,
            answer: $scope.answer
        };
        Faq.addfaq(faq);
        console.log(faq);
        $modalInstance.close();
    };
    $scope.Cancel = function () {
        $modalInstance.dismiss();
    };
});

但是当我通过模态提交数据时，它说this.faqList.push不是一个函数。

这是因为您的faqList变量不是数组。

你忽略了第一个定义：

this.faqList = [];

有了这个：

this.faqList = $http.get('/Json/faq.json');

但是$http.get返回的是promise（请参阅文档），而不是数组。

你应该这样做：

this.faqList = [];
$http.get('/Json/faq.json').then(function(result) {
  // process your results here
  this.faqList = result.data;
});

未尝试，但this在函数范围内，因此首先创建一个_this var可能会有所帮助：

this.faqList = [];
this.faqList = $http.get('/Json/faq.json');
var _this = this;
this.getFaqs = function ()
{
    return _this.faqList;
}
this.addfaq = function (obj) {
    _this.faqList.push(obj);
};
相关文章：