Czesc, chcialbym wczytac kod angulara za pomoca funkcji load jquery, lecz niestety nie rozpoznaje on angulara kiedy wczytam go jquery, wczytam jedynie zwykly kod i bootstrap.
0
0
chodzi ci o to, że np. kiedy ściągasz <div ng-repeat="a in arr"></div> powinien robić pętlę a nic się nie dzieje? Pokaż kod albo zrób case na jsfiddle.net
edit: no i popatrz co zwraca konsola błędów w przeglądarce, jeśli w ogóle coś zwraca.
0
<div ng-app="myApp" ng-controller="customersCtrl">
<button type="button" class="btn btn-primary" id="buttoner" >Horrors</button>
<div id="id" class="id" style="width: 1000px; height: 430px; overflow-x:hidden">
<div ng-repeat="x in names | filter:searchText" >
<article>
<h1>{{ x.name}}</h1>
<p>{{ x.desc}}</p>
</article>
</div>
</div>
</div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("plikjson.php").success(function (response) {
$scope.names = response;
});
$http.get("plikjson2.php").success(function (responsee) {
$scope.namess = responsee;
});
});
</script>
<script>
$(document).ready(function(){
$("#buttoner").click(function(){
$("#id").load("test.html");
});
});
</script>
</div>
A teraz kod w pliku test.html
<div ng-repeat="y in namess | filter:searchText" >
<article>
<h1>{{ y.name}}</h1>
<p>{{ y.desc}}</p>
</article>
</div>
Konsola bledow nic nie zwraca niestety. Jedynie takie cos:
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
Ale raczej to nie ma zwiazku ze sprawa. O co tutaj chodzi?
dodanie znaczników <code class="javascript"> - @furious programming
0
$http.get("plikjson.php").success(function (response) {
$scope.names = response;
});
To ma być json w zamierzeniu? Upewnij się, że skrypt PHP zwraca odpowiednie nagłówki. Ale najpierw spróbuj po prostu walnąć console.log(response) i zobaczyć co tam masz. Albo w narzędziach przeglądarki sprawdziłbym czy on to w ogóle pobiera...
0
Ogolnie testowalem czy to get dziala, i owszem dziala. Dopoki nie uzyje funkcji load() to moge umieszczac na jednej stronie nawet 3 czy 5 takich funkcji get. Dopiero problem polega jak funkcja load ma wczytac jakis kod angulara, wtedy traktuje go jakby to nie istnialo.
console.log(response) jak i console.log(responsee) zwracaja prawidlowe wyniki ( czyli te co siedzia w pliku .php z jsonem, tylko ze przy funkcji load() zwyczajnie ich nie wyswietla).
0
To nie sa literowki, uzylem tego celowo, zebym mogl wczytac inny plik .php z zawartoscia jsona.
0
a spróbuj z $compile, może ty będziesz miał więcej szczęścia
https://docs.angularjs.org/api/ng/service/$compile
to się w teorii powinno tak używać bodajże:
$compile(jakis_kod)(scope)
Natomiast nie wiem jak w praktyce, dzisiaj próbowałem użyć tej metody do ominięcia pewnej niedoskonałości Angulara*, niestety nie udało mi się i walił błędami jak szalony. I po różnych próbach postanowiłem zrobić to samo w React i udało się bez żadnych sztuczek... Wydaje mi się, że ogólnie Angular ma duże możliwości ale jest strasznie toporny i czas rozejrzeć się za jakimiś bardziej sensownymi frameworkami).
*tj. Angular nie obsługuje w prosty sposób zagnieżdżonych(rekurencyjnych) dyrektyw i trzeba jakieś cuda wyczyniać (a akurat chcę wyświetlić drzewo, więc muszę się w dyrektywie odwołać do niej samej).
0
Jestem dopiero na etapie nauki Angulara, wiec nie znam wszsystkich jego mozliwosci, zrobilem jedynie caly kurs na codeacademy jakis misiac temu, a teraz postanowilem wroccic i wszystko sobie przypomniec. Ale z tego co widze to angular ma wlasna funkcje ktora pozwala na wczytywanie dokumentow asynchronicznie, nawet po przycisku. Dla wszystkich poczatkujacych Angulara polecam ten kodzik:
<body>
<button ng-click="template='home.html'">Home</button>
<button ng-click="template='home2.html'">Home 2</button>
<div ng-include src="template"></div>
</body>
<script type="text/ng-template" id="home.html">
<div>loaded home</div>
</script>
<script type="text/ng-template" id="home2.html">
<div>loaded home 2</div>
</script>
0
Poczytaj o
ngRoute
oraz
$routeProvider
Jest duzo tutoriali na necie. A jak chcesz zeby to nie byl a href tylko button to na koncu zamien sobie na cos takiego:
<button type="button" class="btn btn-primary" id="button" onClick="location.href='#/secondPage'" >Horrors</button>