Ng-table: Le modèle n'est pas chargé

Ce problème est un doublon beaucoup plus clairement expliqué de https://github.com/esvit/ng-table/issues/957 je pense :D

La solution de contournement pour moi consiste à mettre les modèles dans le cache manuellement.

Je prends la partie générée par le webpack à partir de ng-table.js et la mets dans ma fonction d'amorçage. Étonnamment, la sortie de $templateCache.get('ng-table/pager.html') dans le fichier console.log est maintenant la chaîne de modèle plutôt qu'une promesse.

/* 42 */
/* unknown exports provided */
/*!********************************!*\
  !*** ./src/browser/pager.html ***!
  \********************************/
/***/ function(module, exports, __webpack_require__) {

var path = 'ng-table/pager.html';
var html = "<div class=\"ng-cloak ng-table-pager\" ng-if=\"params.data.length\">\n    <div ng-if=\"params.settings().counts.length\" class=\"ng-table-counts btn-group pull-right\">\n        <button ng-repeat=\"count in params.settings().counts\" type=\"button\"\n                ng-class=\"{'active':params.count() == count}\"\n                ng-click=\"params.count(count)\" class=\"btn btn-default\">\n            <span ng-bind=\"count\"></span>\n        </button>\n    </div>\n    <ul ng-if=\"pages.length\" class=\"pagination ng-table-pagination\">\n        <li class=\"page-item\" ng-class=\"{'disabled': !page.active && !page.current, 'active': page.current}\" ng-repeat=\"page in pages\" ng-switch=\"page.type\">\n            <a class=\"page-link\" ng-switch-when=\"prev\" ng-click=\"params.page(page.number)\" href=\"\">&laquo;</a>\n            <a class=\"page-link\" ng-switch-when=\"first\" ng-click=\"params.page(page.number)\" href=\"\"><span ng-bind=\"page.number\"></span></a>\n            <a class=\"page-link\" ng-switch-when=\"page\" ng-click=\"params.page(page.number)\" href=\"\"><span ng-bind=\"page.number\"></span></a>\n            <a class=\"page-link\" ng-switch-when=\"more\" ng-click=\"params.page(page.number)\" href=\"\">&#8230;</a>\n            <a class=\"page-link\" ng-switch-when=\"last\" ng-click=\"params.page(page.number)\" href=\"\"><span ng-bind=\"page.number\"></span></a>\n            <a class=\"page-link\" ng-switch-when=\"next\" ng-click=\"params.page(page.number)\" href=\"\">&raquo;</a>\n        </li>\n    </ul>\n</div>\n";
var angular = __webpack_require__(/*! angular */ 0);
angular.module('ng').run(['$templateCache', function(c) { debugger; c.put(path, html) }]);
module.exports = path;

@faceleg Pour info

Comment cela affecte-t-il la taille du paquet ?

J'ai eu les mêmes problèmes avec certains modèles HTML manquants lors de l'utilisation de ngTable avec Webpack 2.2. L'importation du module ngTable depuis le répertoire /bundles semble fonctionner correctement. Mais cela ressemble plus à une solution de contournement pour le moment, je suppose.

import { ngTableModule } from 'ng-table/bundles/ng-table';

angular.module('myapp', [
    ngTableModule.name
]);

Merci @Boosten , cela a fonctionné pour moi (le script le déteste cependant)

J'ai aussi ce problème.
J'ai fini par copier les fichiers html et le dossier de filtre de 'ng-table/src/browser' vers un dossier ng-table dans ma racine Web '~/ng-table/'
N'utilise pas de webpack, utilise un script dactylographié sans modules. Essentiellement juste une application ES5 compilée. (J'essaye toujours de comprendre comment obtenir des saisies à enregistrer dans un projet non-module lorsqu'elles ne sont pas globales ou en dehors du répertoire @types car je ne peux pas utiliser l'importation)

De plus, 'ng-table/src/browser/date.html' est manquant.
J'ai installé ng-table à partir de npm et c'est la version 3.0.1

J'ai réussi à obtenir le chargement des modèles sans aucune étape manuelle, en configurant Webpack avec ce qui suit dans mon fichier webpack.config.js (à l'aide de Webpack 3.11.0):

    module: {
      rules: [
        // ...
        { test: /ng-table\/.*\.html$/, use: ['ngtemplate-loader?requireAngular&relativeTo=/src/browser/&prefix=ng-table/', 'html-loader'] }
      ]
    }

Cela nécessite également l'installation des packages ngtemplate-loader et html-loader NPM ; une fois cela fait, cette configuration devrait fonctionner telle quelle pour toute autre personne utilisant Webpack 3.x. (Pour Webpack 2.x ou 4.x, une ligne similaire devrait fonctionner mais peut-être dans une partie différente du fichier de configuration Webpack). Cela oblige Webpack à compiler les modèles dans mon fichier vendor.bundle.js comme suit :

/* 570 */
/***/ (function(module, exports, __webpack_require__) {

// Module
var code = "<div class=\"ng-cloak ng-table-pager\" ng-if=\"params.data.length\"> <div ng-if=\"params.settings().counts.length\" class=\"ng-table-counts btn-group pull-right\"> <button ng-repeat=\"count in params.settings().counts\" type=\"button\" ng-class=\"{'active':params.count() == count}\" ng-click=\"params.count(count)\" class=\"btn btn-default\"> <span ng-bind=\"count\"></span> </button> </div> <ul ng-if=\"pages.length\" class=\"pagination ng-table-pagination\"> <li class=\"page-item\" ng-class=\"{'disabled': !page.active && !page.current, 'active': page.current}\" ng-repeat=\"page in pages\" ng-switch=\"page.type\"> <a class=\"page-link\" ng-switch-when=\"prev\" ng-click=\"params.page(page.number)\" href=\"\">&laquo;</a> <a class=\"page-link\" ng-switch-when=\"first\" ng-click=\"params.page(page.number)\" href=\"\"><span ng-bind=\"page.number\"></span></a> <a class=\"page-link\" ng-switch-when=\"page\" ng-click=\"params.page(page.number)\" href=\"\"><span ng-bind=\"page.number\"></span></a> <a class=\"page-link\" ng-switch-when=\"more\" ng-click=\"params.page(page.number)\" href=\"\">&#8230;</a> <a class=\"page-link\" ng-switch-when=\"last\" ng-click=\"params.page(page.number)\" href=\"\"><span ng-bind=\"page.number\"></span></a> <a class=\"page-link\" ng-switch-when=\"next\" ng-click=\"params.page(page.number)\" href=\"\">&raquo;</a> </li> </ul> </div> ";
// Exports
var _module_exports = code;;
var path = 'ng-table/pager.html';
var angular = __webpack_require__(0);
angular.module('ng').run(['$templateCache', function(c) { c.put(path, _module_exports) }]);
module.exports = path;

/***/ }),

Notez que le chemin est ng-table/pager.html . La partie relativeTo=/src/browser/ de la configuration Webpack transforme node_modules/ng_table/src/browser/pager.html en pager.html , puis prefix=ng-table/ ajoute le préfixe ng-table au nom que ngtemplate- loader le compile avec. Il en résulte que le cache de modèles d'Angular est préchargé avec un modèle ng-table/pager.html , et donc lorsque le code ng-table demande le modèle ng-table/pager.html , Angular le trouve et l'affiche correctement.