2017-01-05 7 views
2

Я новичок в plunker/jsfiddle и пытается создать плункер Angular Datatable Selecting rows, но он не работает в соответствии с данным руководством.AngularJs datatable plunker не работает

Вот мой plunker: https://embed.plnkr.co/1squczHPOaeHpe26zUwt/

Я не могу найти проблему. Любая помощь будет оценена по достоинству.

+1

Вы plunkr совершенно неправильно. Первое, что вы пропустили, чтобы включить ng-app = "". Вы не были вызваны необходимыми модулями и не вводились в соответствии с вашим требованием. –

+0

не могли бы вы его обновить? Я добавил ng-app, но он не вносил изменений. –

ответ

2

Вот обновление, которое решает большинство ваших вопросов, которые были:

  • двойного использование нг-приложения
  • недостающих скриптами для некоторых необходимых библиотек
  • недостающих зависимости модуля декларации
  • недостающей декларирование зависимостей контроллера

См. https://plnkr.co/edit/AXaixxzdapWnQkjBp1bg?p=preview, некоторые изменения включают в себя:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.13/js/jquery.dataTables.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-datatables/0.5.6/angular-datatables.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-resource/1.6.1/angular-resource.min.js"></script> 

angular 
    .module('showcase', ['datatables', 'ngResource']) 
    .controller('RowSelectCtrl', ['$compile', '$scope', '$resource', 'DTOptionsBuilder', 'DTColumnBuilder', function ($compile, $scope, $resource, DTOptionsBuilder, DTColumnBuilder) { ... 

<div ng-app="showcase"> 
    <div ng-controller="RowSelectCtrl as showCase"> 
    <p class="text-danger">You selected the following rows:</p> 
    <p> 
    </p><pre>{{ showCase.selected | json }}</pre> 
    <p></p> 
    <table datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover"></table> 
    </div> 
</div> 
+0

ваш плункер не работает –

+0

извините, что была неправильная ссылка - теперь нужно работать –

+0

да .. он работает сейчас. благодаря –