Использование ng-init для привязки переменной к значению в моем контроллере

Я работаю над страницей редактора. Я получаю Json с моего сервера, который содержит:

{
    "Q_id": 1,
    "isMultipuleAns": 0,
    "Q_mediaType": "page"
}

И я пытаюсь поместить информацию во входной div (type = text) или textarea div.

<textarea 
    type="text" 
    name="question_title" 
    ng-model="question.question_title" 
    ng-init="question.question_title=index"`>

и в моем контроллере у меня есть что-то вроде этого:

app.controller("someController",function($scope,$location,$http){
    // some http requests that puts the mentioned jason in $scope.myJson
    $scope.index= $scope.myJson.Q_id;
}

И что бы я ни пытался, ng-init работает только со статической строкой. Я не могу сделать так, чтобы настоящий ID появился на сайте. Получает только пустое поле ввода.

Я новичок в html и/или angular... помогите?


person lolu    schedule 10.06.2017    source источник
comment
См. красный текст здесь: этой директивой можно злоупотреблять, чтобы добавить ненужное количество логики в ваши шаблоны. Есть только несколько подходящих применений ngInit, например, для псевдонимов специальных свойств ngRepeat, как показано в демонстрации ниже; и для ввода данных через сценарии на стороне сервера. Помимо этих нескольких случаев, вы должны использовать контроллеры, а не ngInit для инициализации значений в области видимости. docs.angularjs.org/api/ng/directive/ngInit Короче говоря кроме перечисленных случаев (и я бы сказал только первого) не используйте ng-init.   -  person shaunhusain    schedule 11.06.2017


Ответы (3)


Вы не можете использовать ng-init в своем вводе, как вы это делали, потому что он работает в начале вашего проекта, когда появляется ваше представление.

итак, что ng-init для меня делает !?

ng-init используется для вызова функций из controller внутри view или устанавливает значения по умолчанию для переменных (которые не использовались как ng-model), например:

 var controller = function($scope){
   $scope.makeNewId = function(){
      return 15899933666;
   }
 }

в этом примере мы можем вызвать $scope.makeNewId() непосредственно в контроллере, также мы можем сделать это, когда наш view компилируется как ng-init="makeNewId()", и если вы обратите внимание, это работает при каждой перезагрузке страницы

так что не так с моими кодами!

в ваших кодах вы хотите установить значение ng-model с ng-init, совершенно неправильно

если вы спросите, почему, то, поскольку вы используете что-то вроде этого question.question_title, это означает, что у вас есть object имя которого question; поэтому я могу легко определить его в своем контроллере:

 var controller = function($scope){
    $scope.question = {
      question_title: $scope.myJson.Q_id
    };
 }
person Maher    schedule 11.06.2017
comment
Благодарю вас! Я искал что-то подобное! это действительно помогает моей структуре! - person lolu; 12.06.2017

Я предполагаю, что это потому, что вы вызываете $scope.index= $scope.myJson.Q_id; внутри асинхронного метода - и это когда ng-inits уже запущен (не могу точно сказать, так как предоставлено недостаточно кода).

Но в целом, вы, вероятно, могли бы использовать другой способ, чем ng-init, так как размещение логики приложения внутри представления является довольно плохой практикой. Почему бы и нет:

$scope.index= $scope.myJson.Q_id;
$scope.question.question_title= $scope.myJson.Q_id;

Кроме того, бывают случаи, когда вы можете отложить ng-init с помощью ng-if, например:

<textarea type="text" name="question_title" ng-model="question.question_title" ng-if="index" ng-init="question.question_title=index">
person Michał Sałaciński    schedule 10.06.2017

Используйте тег ng-init в div, окружающий вашу текстовую область, как показано ниже.

<div ng-init="question.question_title=index">
    <textarea type="text" name="question_title" ng-model="question.question_title">
</div>

Предполагается, что это предварительно заполнит вашу текстовую область данными в $scope.question.question_title и убедитесь, что в вашем контроллере $scope.question уже определен таким образом.

$scope.question = {
   question_title:""
}
person Balaji    schedule 11.06.2017