Блог

Главная - Вопросы по программированию - Как получить доступ к внутреннему значению script $scope в функции контроллера в angular JS

Как получить доступ к внутреннему значению script $scope в функции контроллера в angular JS

#javascript #angularjs #angularjs-scope #angular-controller

#javascript #angularjs #angularjs-scope #angular-контроллер

Вопрос:

Вот HTML с внутренним скриптом

  <html> 
   <body ng-controller="test">  
      <span> {{data.name}} </span>
      <input ng-model="data.name"> 
      <hidden id="test" ng-hide="true"></hidden>
   </body>
 <script> 
    var $scope = angular.element(document.getElementById('test')).scope();
    $scope.data = {
     name : test;
    };
 <script>

</html>

Вот контроллер

 app.controller('test', function($scope) {
 $scope.data = {};

 console.log($scope.data.name)  //outputs undefined

 })

Я хочу, чтобы данные внутреннего скрипта были переданы в контроллер. Он печатает неопределенный. Я определил объект в контроллере, но обновил его во внутреннем скрипте. Если предположить, что я печатаю или связываю данные из HTML, они не обновляются в объекте области контроллера. Любое решение для этого?

Комментарии:

1. Я думаю, что сначала будет запущен ваш код контроллера, а затем ваш внешний код для обновления вашей области. Итак, как определить это значение, которое вы регистрируете в данный момент?

Ответ №1:

Вы пытались извлечь его из контроллера? Или, может быть, вам понадобится более ангулярный подход. Я создал два примера: один для инициализации данных в контроллере, а другой для консоли.войдите в систему niceLittleValue .

 (function(angular) {
  'use strict';
  var myApp = angular.module('niceExample', []);
  myApp.config(['$compileProvider', function($compileProvider) {
    $compileProvider.debugInfoEnabled(false);
  }]);
  myApp.controller('test', ['$scope', function($scope) {
    $scope.data = [];
    $scope.data.name = 'test';

    $scope.data.anotherTest = angular.element(document.querySelector('#anotherTest'));
    console.log($scope.data.anotherTest[0]);

  }]);
})(window.angular);  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<html ng-app="niceExample">

<body ng-controller="test">
  <input ng-model="data.name" ng-model-options="{debounce: 500}">
  <span> {{data.name}} </span>
  <hidden id="test" ng-hide="true"></hidden>
  <hidden id="anotherTest" value="niceLittleValue" ng-hide="true"></hidden>
  <span> {{data.anotherTest}} </span>
</body>

</html>