javascript - solucionar - marko js

Marco iónico: $ scope no está definido en alerta simple

Question

.controller(''newGoalCtrl'', function($scope, $ionicPopup) {
$scope.addNewGoal = function() {
alert($scope.goaltitle);
};
});
<ion-pane view-title="goal">
<ion-header-bar class="bar-positive">
<div class="buttons">
<a nav-transition="android" class="button button-icon icon ion-arrow-left-b" ng-click="" href="#/index"></a>
</div>
<h1 class="title">Add New Goal</h1>
</ion-header-bar>
<ion-content class="padding" scroll="false" >
<div class="list">
<label class="item item-input">
<input type="text" placeholder="#Title" ng-model="goaltitle">
</label>
<label class="item item-input">
<span class="hashtag-title">#{{hashtagname}}</span>
</label>
<label class="item item-input">
<textarea placeholder="Goal"></textarea>
</label>
</div>
</ion-content>
<ion-tabs class="tabs-icon-top tabs-color-active-positive">
<button class="button button-positive button-bar no-round-corner" ng-click="addNewGoal()">Add Goal</button>
</ion-tabs>
</ion-pane>

Este es mi código ... No sé cómo explicarlo, pero siempre digo indefinido cuando introduzco algo en el cuadro de texto ...

pero $ scope.goaltitle = "algo" está trabajando en .controller (); ...

Answer 1

Para el html

<input type="text" placeholder="#Title" ng-model="foo.goaltitle">

JS:

$scope.foo = {{
goaltitle : ''''
}}

Answer 2

Respuesta corta

La causa principal de este problema es que el ion-content crea un alcance infantil heredado prototípicamente, por goaltitle el tipo de goaltitle (tipo primitivo) del alcance del controlador es diferente del goaltitle que está utilizando en ng-model

Lo ideal es practicar seguir dot rule mientras se define el modelo de vista. De modo que la regla de herencia prototípica se seguirá con la jerarquía de alcance.

Debe definir el objeto y luego asignarle toda la propiedad ng-model .

Controlador

.controller(''newGoalCtrl'', function($scope, $ionicPopup) {
$scope.model = {};
$scope.addNewGoal = function() {
alert($scope.model.goaltitle);
};
});

Luego, tenga goalTitle , Goal , etc. en ella.

Margen

<ion-content class="padding" scroll="false" >
<div class="list">
<label class="item item-input">
<input type="text" placeholder="#Title" ng-model="model.goaltitle">
</label>
<label class="item item-input">
<span class="hashtag-title">#{{hashtagname}}</span>
</label>
<label class="item item-input">
<textarea placeholder="Goal" ng-model="model.Goal"></textarea>
</label>
</div>
</ion-content>

No quiero volver a escribir toda la explicación nuevamente, así que aquí estoy haciendo referencia a una respuesta similar , donde he cubierto toda la información detallada.