2017-07-08 3 views
0

Here is my runnable plunkerWarum meine UI Grid kann nicht das Netz laden

Ich folgte dem Tutorial in UI Grid official tutorial. Ich weiß nicht, warum ich das Gitter nicht laden kann. Ich habe keinen Syntaxfehler gefunden.

Hier ist ein Teil von Fehlern von der Konsole ist:

URL/ Redakteur 1.2.0.js besucht: 2 URL besucht/p = Katalog emmet.js fehlgeschlagen Ressource laden: der Server reagiert mit einem Status von 404 (nicht gefunden) editor-1.2.0.js: 7 AUTH-Objekt editor-1.2.0.js: 2 Event verfolgt Plunk Verschönern Symbolleiste undefined undefined editor-1.2.0.js: 2 Event verfolgt Plunk Save Toolbar undefined undefined editor-1.2.0.js: 2 URL besucht/oXEt5IfdrpkkPSxysncy? P = Katalog editor-1.2.0.js: 2 Event verfolgt Multipane Show Previ ew Toolbar undefined undefined editor-1.2.0.js: 2 URL besucht/oXEt5IfdrpkkPSxysncy? p = Vorschau run.plnkr.co/:1 Gemischter Inhalt: Die Seite unter 'https://plnkr.co/edit/oXEt5IfdrpkkPSxysncy?p=preview' wurde über HTTPS geladen, aber ein unsicheres Skript angefordert 'http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js'. Diese Anfrage wurde blockiert. Der Inhalt muss über HTTPS bereitgestellt werden.

<!DOCTYPE html> 
<html ng-app="app"> 

<head> 
    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css"> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
    <script src="http://ui-grid.info/release/ui-grid.js"></script> 
</head> 

<body> 
    <h1>Hello Plunker!</h1> 

    <div ng-controller="MainCtrl"> 
     <div ui-grid="{ data: myData }" class="myGrid"></div> 
    </div> 

    <script> 
     var app = angular.module('app', ['ui.grid']); 
     app.controller('MainCtrl', ['$scope', function($scope) { 
      $scope.myData = [{ 
        "firstName": "Cox", 
        "lastName": "Carney", 
        "company": "Enoromo", 
        "employed": true 
       }, { 
        "firstName": "Lorraine", 
        "lastName": "Wise", 
        "company": "Comveyer", 
        "employed": false 
       }, { 
        "firstName": "Nancy", 
        "lastName": "Waters", 
        "company": "Fuelton", 
        "employed": false 
       } 
      ]; 
     }]) 
    </script> 

    <style> 
     .myGrid { 
      width: 500 px; 
      height: 250 px; 
     } 
    </style> 
</body> 

</html> 

Antwort

1

CDN für ui-Gitter war nicht korrekt. Und alle Ihre src sollten auf eine sichere URL verweisen, d. H. Mit https. Der Grund dafür ist, dass Sie versuchen, von einer sicheren Site aus auf ein unsicheres Skript zuzugreifen. Dies wird blockiert, da Inhalte nur über HTTPS bereitgestellt werden können.

<head> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.6/ui-grid.css" type="text/css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-grid/4.0.6/ui-grid.min.js"></script> 
    </head> 

Arbeits Plunkr: https://plnkr.co/edit/I87wgFzlqmtl6dcPem6F?p=preview

+0

Aber, können Sie diesen offiziellen Plunker überprüfen, haben sie nicht https verwenden, etc http://plnkr.co/edit/?p=preview – EntryLeveDeveloper

+0

https: //plnr.co/edit/?p=catalogue. Überprüfen Sie noch einmal den offiziellen Plocker, während Sie beliebte pakages hinzufügen, es zeigt auf https statt auf einen unsicheren http-Server. – Vivz

+0

Und wenn Sie über script.js und style.css sprechen, ist das die gleiche Ordnerstruktur von plunkr, also müssen sie nicht https verwenden, sie können direkt darauf verweisen. – Vivz

Verwandte Themen