Angularjs ngroute Daten nicht auf der zweiten Seite

Okay, ich bin neu in Angular und um die Fähigkeiten zu testen, die ich auf Codecademy bekommen habe, mache ich eine Testseite von Musikkünstlern. Die erste Seite ist eine Liste von Künstlern. Wenn Sie auf einen Block des Künstlers klicken, werden die Informationen des Künstlers auf derselben Seite geladen. Aus welchem Grund auch immer, die erste Seite geht gut, aber die zweite Seite ist das Problem.Angularjs ngroute Daten nicht auf der zweiten Seite

Die Vorlage lädt in Ordnung (da Sie die Stil-Elemente auf der Seite Bereich können), aber die Daten nicht durchgehen. Es ist zum größten Teil leer.

Ich habe alles versucht, was ich mir vorstellen kann, aber ich kann dieses Ei nicht knacken. Wenn ihr helfen könnt, werde ich super mega überglücklich sein! Es gibt unten ein paar Schnipsel, aber das Ganze ist hier auf Plunker: https://plnkr.co/edit/67DAyg8ApyNYgVwvvlyw?p=info

HTML:

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js" type="text/javascript"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular-resource.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js" type="text/javascript"></script> 
</head> 

<body> 
    <div class="main"> 
     <div class="container"> 
     <div ng-view></div> 
     </div> 
    </div> 
    <!-- Modules --> 
    <script src="app.js" type="text/javascript"></script>  
    <!-- Controllers --> 
    <script src="ArtistController.js" type="text/javascript"></script>  
</body>

Javascript:

var app = angular.module('FavArtistsApp', ['ngRoute']); 

app.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider.when('/', {templateUrl: 'Mural.html', controller: 'ArtistController'}) 
    $routeProvider.when('/:artistsId', {templateUrl: 'Artist.html', controller: 'ArtistController'}); 
    $routeProvider.otherwise({redirectTo: '/'}); 
}]);

Quelle

2016-08-04 Agape

Um erwartete Ergebnis zu erzielen, verwenden Sie unter

Erfassen Sie den Routenparameterindex unter Verwendung von $routeParams.

app.controller('ArtistController', ['$scope','$routeParams', function($scope,$routeParams)
diesen Index verwenden und das ausgewählte Objekt erhalten, indem Sie unter

$scope.currentArtist = $scope.artists[$routeParams.artistsId]

verwenden, das Bereichsobjekt ausgewählt und angezeigt werden auf der zweiten Seite

<a class="button back" href="#/">Back</a> 

<h2 class="artist-name">{{currentArtist.name}}</h2> 
<p class="debut">Their debut album dropped in {{currentArtist.debutYear}}</p> 
<p class="album">Favorite album:<br/> 
    <img ng-src="{{currentArtist.albumCover}}" height="300" width="300"/><br/> 
{{currentArtist.favoriteAlbum}}</p> 
<div> 
    <iframe width="560" height="315" ng-src="{{currentArtist.track}}" frameborder="0" allowfullscreen></iframe> 
</div> 
<p class="bio">{{currentArtist.bio}}</p>

https://plnkr.co/edit/YxvCZUoaCn40vu9jEH6j?p=preview

Quelle

2016-08-04 21:25:20

Novaselic! Es funktioniert, aber das Video wird immer noch nicht angezeigt. Wie bekommst du ein YouTube-Video zur Anzeige? – Agape

@Agape youtube funktioniert nicht wegen der SCE (Strict Contextual Escaping) ... Ich habe den Code aktualisiert, um zu reparieren-https: //plnkr.co/edit/YxvCZUoaCn40vu9jEH6j? P = preview .. hoffe, das funktioniert für Sie :) –

Das hat meine Probleme behoben, @ Naga, jemand sagt dir jemals, du bist schön? Wo hast du diese Tricks ausgewählt? – Agape

Angularjs ngroute Daten nicht auf der zweiten Seite

Antwort

Verwandte Themen