5

Gostaria de saber como posso acessar o conteúdo da variável scope no AngularJS?

Teoricamente fiz tudo "correto", ou seja, declarando a variável no controller e atribuindo valores na mesma:

var app = angular.module('vagalume', []);
app.controller('BandsController', function($scope) {
  $scope.teste = 'VALOR DE TESTE';
  this.lista = [
    {
      nome: 'U2',
      estilo: 'Rock'
    },
    {
      nome: 'Guns And Roses',
      estilo: 'Rock'
    },
    {
      nome: 'Scorpions',
      estilo: 'Rock'
    }
  ];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script>

<body ng-app="vagalume">
  <div class="artistas" ng-controller="BandsController as bandas">
    {{'TESTE:' + bandas.teste}}
    <ul>
      <li ng-repeat="banda in bandas.lista">{{banda.nome}}</li>
    </ul>
  </div>
</body>

O teste nunca retorna nada...

Link com o código: http://jsfiddle.net/v0pLv0ny/

0

3 Respostas 3

5

Quando você acessa vincula a propriedade com a variável

$scope.teste

você não consegue acessar a mesma com o Alias do controller {{bandas.teste}}

você pode acessar ela da seguinte forma {{teste}}.

para acessar as propriedades criadas no Alias do controller, você tem que criar ela no controlador da seguinte forma.

this.teste = valor (This = Controller)

app.controller('BandsController', function ($scope) { this == controller }

2
  • Valeu pela descricao na diferença entre o this e o $scope ! Commented 18/08/2015 às 17:49
  • +1 por descrever a razão correta. =)
    – OnoSendai
    Commented 18/08/2015 às 17:50
3

Ou muda $scope.teste para this.teste no js, que vai funcionar.

Ou no html muda {{'TESTE:' + bandas.teste}} para {{'TESTE:' + teste}}

1
  • 1
    Valeu cara era isso mesmo ! vlw Commented 18/08/2015 às 17:47
2

A referência para o escopo precisava ser corrigida. O exemplo abaixo mostra o seu conteúdo funcionando:

var app = angular.module('vagalume', []);
	app.controller('BandsController', function ($scope) {		
		$scope.teste = 'VALOR DE TESTE';
		$scope.lista = [
			{
				nome: 'U2',
				estilo: 'Rock'
			},
			{
				nome: 'Guns And Roses',
				estilo: 'Rock'
			},
			{
				nome: 'Scorpions',
				estilo: 'Rock'
			}
		];
	});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="vagalume">
	<div class="artistas" ng-controller="BandsController as bandas">
		{{'TESTE:' + teste}}
		<ul>
			<li ng-repeat="banda in lista">{{banda.nome}}</li>
		</ul>		
	</div>	
</body>

2
  • Valeu cara era isso mesmo ! vlw Commented 18/08/2015 às 17:47
  • @DouglasdosSantos sempre um prazer ajudar!
    – OnoSendai
    Commented 18/08/2015 às 17:50

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .