Cómo obtener el controlador infantil para acceder a la función en el controlador principal -- javascript campo con angularjs campo con angularjs-scope campo con ng-controller camp Relacionados El problema

How to get Child Controller to access function in Parent Controller


1
vote

problema

Español

Tengo una configuración simple del controlador de padres e hijos, estoy tratando de que mi controlador de hijos llame a una función en el controlador principal:

html:

  <div ng-controller="Parent>      <p ng-hide="ribbonHide">{{ribbonMessage}}</p>      <div ng-controller="Child">       </div>  </div>   

parent.js:

  app.controller('Parent', function($scope, $timeout) {     $scope.searchRibbon = function() {         return {             default : function() {                 $scope.ribbonMessage = 'Welcome';                 $scope.ribbonHide = false;             },             clearMessage: function() {                 $scope.ribbonMessage = '';             },             hide: function() {                 $scope.ribbonHide = true;             },             autoRemove: function() {                 $timeout(function() {                     $scope.searchRibbon.hide();                     $timeout(function() {                         $scope.searchRibbon.clearMessage();                     }, 500);                 }, 5000);             }         }     } });   

child.js

  app.controller('Child', function($scope, $timeout) {     $scope.$parent.searchRibbon.autoRemove(); });   

con lo anterior en su lugar, obtengo el error:

  TypeError: $scope.$parent.searchRibbon.autoRemove is not a function   

gracias

Original en ingles

I have a simple parent and child controller setup, i am trying to get my child controller to call a function in the parent controller:

HTML:

<div ng-controller="Parent>      <p ng-hide="ribbonHide">{{ribbonMessage}}</p>      <div ng-controller="Child">       </div>  </div> 

Parent.js:

app.controller('Parent', function($scope, $timeout) {     $scope.searchRibbon = function() {         return {             default : function() {                 $scope.ribbonMessage = 'Welcome';                 $scope.ribbonHide = false;             },             clearMessage: function() {                 $scope.ribbonMessage = '';             },             hide: function() {                 $scope.ribbonHide = true;             },             autoRemove: function() {                 $timeout(function() {                     $scope.searchRibbon.hide();                     $timeout(function() {                         $scope.searchRibbon.clearMessage();                     }, 500);                 }, 5000);             }         }     } }); 

Child.js

app.controller('Child', function($scope, $timeout) {     $scope.$parent.searchRibbon.autoRemove(); }); 

With the above in place, i get the error:

TypeError: $scope.$parent.searchRibbon.autoRemove is not a function 

Thanks

           
       
       

Lista de respuestas

3
 
vote
vote
La mejor respuesta
 

mem::size_of::<u32>9 parece ser una función en sí, que devuelve el objeto que está esperando. Como tal, size_of0 debería funcionar.

pero eso parece extraño. ¿Está seguro de que no desea size_of1 para ser un objeto estándar?

  size_of2  

Si necesita el alcance de que la función proporciona, es posible que esté después de algo más a lo largo de las líneas de:

  size_of3  
 

searchRibbon appears to be a function itself, which returns the Object that you're expecting. As such, $scope.$parent.searchRibbon().autoRemove() should work.

But that seems odd. Are you sure that you don't want searchRibbon to be a standard Object?

$scope.searchRibbon = {     default : function() {         $scope.ribbonMessage = 'Welcome';         $scope.ribbonHide = false;     }, // ... the other ribbon properties go here } 

If you need the scoping that the function provides, you might be after something more along the lines of:

$scope.searchRibbon = getSearchRibbon();  function getSearchRibbon() { // This should probably be in a Service     return {         default : function() {             $scope.ribbonMessage = 'Welcome';             $scope.ribbonHide = false;         }, // ... the other ribbon properties go here     } } 
 
 
     
     
1
 
vote

Noté que $ scope.searchribble es una función. En cuyo caso, en el niño, primero deberá llamar primero la función de búsqueda de búsqueda, luego llame a la función Ocultar

  $scope.$parent.searchRibbon().hide();   

O alternativamente, podría declarar $ scope.Searchribon como un objeto, en lugar de una función (mucho más fácil y evitar problemas de alcance).

  angular.module("app", [])    .controller('Parent', function($scope, $timeout) {      $scope.searchRibbon = {        default: function() {          $scope.ribbonMessage = 'Welcome';          $scope.ribbonHide = false;        },        clearMessage: function() {          $scope.ribbonMessage = '';        },        hide: function() {          $scope.ribbonHide = true;        },        autoRemove: function() {          $timeout(function() {            $scope.searchRibbon.hide();            $timeout(function() {              $scope.searchRibbon.clearMessage();            }, 500);          }, 5000);        }      }    })    .controller('Child', function($scope, $timeout) {      $scope.$parent.searchRibbon.hide();    });  
 

I noticed that $scope.searchRibbon is a function. In which case, in the child, you will first need to first call the searchRibbon function, then call the hide function

$scope.$parent.searchRibbon().hide(); 

Or alternately, you could declare $scope.searchRibbon as an object, instead of a function (much easier and avoid scope issues).

angular.module("app", [])    .controller('Parent', function($scope, $timeout) {      $scope.searchRibbon = {        default: function() {          $scope.ribbonMessage = 'Welcome';          $scope.ribbonHide = false;        },        clearMessage: function() {          $scope.ribbonMessage = '';        },        hide: function() {          $scope.ribbonHide = true;        },        autoRemove: function() {          $timeout(function() {            $scope.searchRibbon.hide();            $timeout(function() {              $scope.searchRibbon.clearMessage();            }, 500);          }, 5000);        }      }    })    .controller('Child', function($scope, $timeout) {      $scope.$parent.searchRibbon.hide();    });
 
 

Relacionados problema

0  Compartir datos entre páginas en iónico  ( Sharing data between pages in ionic ) 
Estoy trabajando en un proyecto iónico. Quiero compartir datos entre las páginas. A continuación se muestra lo que he hecho. Pero no está funcionando. Puede q...

0  ¿Por qué el valor es "indefinido" después de pasar a la función del controlador?  ( Why value is undefined after passing to controller function ) 
No estoy seguro de por qué import scrapy class MatrixScrapeItem(scrapy.Item): # define the fields for your item here like: # name = scrapy.Field() ...

0  Cómo dibujar Autocharts según el valor de una casilla de verificación en AngularJS  ( How to draw highcharts based on the value of a checkbox in angularjs ) 
Segundo controlador que no funciona en AngularJS Quiero crear una aplicación en la que cuando hace clic en una casilla de verificación, una Highcharts se ...

0  ¿Cómo puede iterar a través de los controladores en un NG-repite del padre?  ( How can you iterate through controllers in an ng repeat from the parent ) 
Quiero escribir un bucle para todos los controladores infantiles y ejecuta una función en ellos. En este momento, el código solo está ejecutando la función en...

0  SERVICIO SER LLAMADO MULTILLATE TIEMPOS EN ANGULAR  ( Service being called multilple times in angular ) 
Tengo el siguiente servicio angular //SERVICES app.service('userInfo', function($http){ this.getInfo = function() { var BASE_URL = ""; ...

0  AngularJS JSON Carga del archivo con ng-clic  ( Angularjs json load from file with ng click ) 
Actualmente quiero mostrar la tabla HTML al analizar los datos de JSON del archivo con JS angular, y no funciona, ¿puede alguien ayudarme? y también como me...

0  Tener problemas para usar Ngchange para actualizar el modelo  ( Having trouble using ngchange to update model ) 
Acabo de empezar a aprender los conceptos básicos de la angular. Estoy intentando hacer un convertidor de salario anual, solo por diversión. Estoy teniendo di...

0  Angular JS: ¿Pueden dos páginas diferentes tienen la misma aplicación NG y un controlador NG?  ( Angular js can two different pages have same ng app and ng controller ) 
Estoy construyendo pocas páginas web donde tengo que mostrar el contenido con la ayuda de angular. problema : Los enlaces que toman mi página a otra página...

0  En AngularJS es posible configurar un controlador NG a través de un nombre de variable?  ( In angularjs is possible to set a ng controller through a variable name ) 
Pregunta simple, este es mi escenario: <div ng-repeat="slide in sliders" onfinishrender id="slide-page-{{slide.id}}" class="slidepage" data-page-type="{{sl...

99  ¿Manera más fácil de pasar una variable de alcance angularJS de la directiva al controlador?  ( Easiest way to pass an angularjs scope variable from directive to controller ) 
¿Cuál es la forma más fácil de pasar una variable de alcance angularJS de la directiva al controlador? Todos los ejemplos que he visto parecen tan complejos, ...




© 2022 respuesta.top Reservados todos los derechos. Centro de preguntas y respuestas reservados todos los derechos