ion-content 和 ion-footer 有不同的 $scope [英] ion-content and ion-footer have different $scope

问题描述

我的 ion-content 中有两个输入字段，它们都附加了一个 ng-model.然后在我的 ion-footer 中，我有一个 ng-click，我在其中调用了一个函数并传入了两个 ng-model.

I have two input fields inside my ion-content and they both have an ng-model attached to them. Then inside my ion-footer I have an ng-click where I call a function and pass in the two ng-models.

当我在 ion-content 中使用 ng-click 时，这一切都很好，但是当我将它移动到页脚时，我传递给函数的两个参数没有定义.

This all worked fine when I had the ng-click inside the ion-content, but when I move it to the footer I get undefined for the two parameters I pass to the function.

这是否意味着 ion-content 和 ion-footer 具有不同的 $scope ?即使它们在同一个文件中并且具有相同的控制器??

So does this mean that ion-content and ion-footer have different $scope's? Even though they're in the same file and have the same controller??

推荐答案

我相信 ion-footer &ion-content 创建新的子作用域，它是 原型从当前范围继承.下面的 ionic 代码将更好地说明它的内部工作原理，scope: true, 负责创建一个新的子作用域.

I believe ion-footer & ion-content creates new child scope which is Prototypically inerherit from current scope. Below ionic code will give you better illustration that how it works internally, the scope: true, is responsible for creating a new child scope.

代码

.directive('ionContent', [
  '$parse',
  '$timeout',
  '$ionicScrollDelegate',
  '$controller',
  '$ionicBind',
function($parse, $timeout, $ionicScrollDelegate, $controller, $ionicBind) {
  return {
    restrict: 'E',
    replace: true,
    transclude: true,
    require: '^?ionNavView',
    scope: true, //<-- this creates a prototypically inerherited scope
    template:
    '<div class="scroll-content">' +
      '<div class="scroll"></div>' +
    '</div>',

您需要使用 . 注释将解决您的问题

You need to use . annotation will fix your problem

例如

如果你使用变量作为原始类型

If you are using variable as primitive like

$scope.volume = 5

那么你需要使用:

$scope.data = { 'volume' : 5}

Angular 原型范围继承

这篇关于ion-content 和 ion-footer 有不同的 $scope的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！