离子含量和离子页脚具有不同的范围

时间:2015-05-08 09:01:09

标签: javascript angularjs cordova angularjs-scope ionic-framework

我的离子内容中有两个输入字段,它们都附有ng模型。然后在我的离子脚里面,我有一个ng-click,我称之为一个函数并传入两个ng-model。

当我在离子内容中进行ng-click时,这一切都运行正常,但是当我将它移动到页脚时,我对于传递给函数的两个参数没有定义。

这是否意味着离子含量和离子页脚具有不同的$ scope?即使它们在同一个文件中并且具有相同的控制器??

2 个答案:

答案 0 :(得分:7)

我相信ion-footer& ion-content从当前范围创建新的子范围Prototypically inerherit。下面的离子代码将为您提供内部工作原理的更好说明,scope: true,负责创建新的子范围。

<强>代码

.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>',

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

例如

如果您使用变量作为基元,如

$scope.volume = 5

然后你需要使用:

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

Angular Prototypal Scope Inheritance

答案 1 :(得分:4)

pankajparkar的评论中的答案解释:

ion-content指令有其新的范围。它使用点表示法(在处理范围继承时很重要)

这就是为什么它适用于ng-model =“data.model1

请参阅:

AngularJS documentation on scopes

Egghead video