angularjs - 将变量传递给作为组件的模态

Question

我想将数据传递给模态，而不传递所有 $scope。我的模态在组件中。

angular.module('app').component('testModal', {
  templateUrl: '/test-modal',
  bindings: {
    close: '&',
    dismiss: '&',
    resolve: '<'
  },


  controller: function ($scope, test) {
    var vm = this;
    this.test = test;

    this.save = () => {
      this.close()
    }

    this.cancel = function () {
      this.dismiss()
    }
  }
})

我尝试传递如下数据（来自另一个控制器）

function openModal() {
            testService.getTest().then(function(data) {
                var modalInstance = $uibModal.open({
                    component: 'testModal',
                    size: 'lg',
                    resolve: {
                        test: function () {
                          return data;
                        }
                      }
                  })   
            })

          }

但我有错误：angular.js:15567 Error: [$injector:unpr] Unknown provider: testProvider <- test <- catchError

我该如何处理？为什么在我的模态组件中没有读取“测试”？

Answer 1

当您使用带有 的组件时$uibModal，您不必在控制器中注入解析的数据。它可以在下面访问this.resolve（如果您使用resolve绑定，就像您所做的那样）。

将组件的控制器定义更改为：

controller: function ($scope) {      // <-- removed `test` injection
    var vm = this;
    console.log(this.resolve.test);  // <-- `test` is on `resolve` object
                                     // <-- removed this.test = test
    this.save = () => {
      this.close()
    }
    this.cancel = function () {
      this.dismiss()
    }
}