¿Sera buena está directiva para implementar Disqus en mi aplicación web con AngularJS? ¿Existe alguna forma mejor de implementarlo?
Si no existe otra forma por favor pueden darme un ejemplo de cómo implementar la directiva ya mencionada.
¿Sera buena está directiva para implementar Disqus en mi aplicación web con AngularJS? ¿Existe alguna forma mejor de implementarlo?
Si no existe otra forma por favor pueden darme un ejemplo de cómo implementar la directiva ya mencionada.
Una forma de saber cuando una directiva es buena en Github es mirando el número de estrellas / forks / watchs que tiene.
Mientras más alto el número más probabilidades tienes de que sea buena. Esto no es del todo confiable pero te dá una buena idea del nivel de "soporte de la comunidad" que tiene y las probabilidades que te vaya bien usandola. En lo personal me he encontrado con directivas muy buenas que tienen bugs muy molestos que me han obligado a usar alternativas así que realmente la única forma de saberlo es probando.
Si quieres un ejemplo aquí te dejo uno. Ten en cuenta que en la documentación especifican bien claro que debes tener el modo html5 activado o usar hashbang #! de lo contrario no funcionará bien.
angular.module('app', ['angularUtils.directives.dirDisqus'])
.config(function($locationProvider) {
$locationProvider.hashPrefix('!');
})
.controller('DiscusCtrl', function() {
var vm = this;
vm.config = {
disqus_shortname: 'Your disqus shortname',
disqus_identifier: 'Comments identifier',
disqus_url: 'Comments url'
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://raw.githubusercontent.com/michaelbromley/angularUtils/master/src/directives/disqus/dirDisqus.js"></script>
<div ng-app="app" ng-controller="DiscusCtrl as vm">
<dir-disqus config="vm.config"></dir-disqus>
</div>
Esto es todo lo que se necesita para utilizarlo. Puedes chequear más opciones en el repo de github y aquí te dejo otro demo en el que puedes poner tus datos y probarla para decidir si te sirve o no.
angular.module('app', ['angularUtils.directives.dirDisqus'])
.config(function($locationProvider) {
$locationProvider.hashPrefix('!');
})
.controller('DiscusCtrl', function($scope) {
var vm = this;
vm.ready = false;
vm.config = {
disqus_on_ready: function() {
alert('Discus loaded');
}
};
$scope.$watch('vm.config', function() {
vm.ready = false;
}, true);
vm.render = function() {
vm.ready = true;
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://raw.githubusercontent.com/michaelbromley/angularUtils/master/src/directives/disqus/dirDisqus.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div ng-app="app" ng-controller="DiscusCtrl as vm">
<form name="DisqusCtrl" class="form-horizontal" ng-submit="vm.render()">
<div class="form-group">
<label for="shortname" class="col-md-3 control-label">Nombre</label>
<div class="col-md-9">
<input id="shortname" class="form-control" name="shortname" ng-model="vm.config.disqus_shortname" required>
</div>
</div>
<div class="form-group">
<label for="shortname" class="col-md-3 control-label">Identifier</label>
<div class="col-md-9">
<input id="identfier" class="form-control" name="identfier" ng-model="vm.config.disqus_identifier" required>
</div>
</div>
<div class="form-group">
<label for="shortname" class="col-md-3 control-label">Url</label>
<div class="col-md-9">
<input id="url" class="form-control" name="url" ng-model="vm.config.disqus_url" required>
</div>
</div>
<div class="form-group">
<label for="shortname" class="col-md-3 control-label">Api key</label>
<div class="col-md-9">
<input id="url" class="form-control" name="url" ng-model="vm.config.disqus_api_key">
</div>
</div>
<button type="submit" class="btn btn-default">Listo</button>
</form>
<div ng-if="vm.ready">
<dir-disqus config="vm.config"></dir-disqus>
</div>
</div>
ng-if="vm.configuration"
o algo parecido. De esa forma solo se mostrará y compilará la directiva si ya tienes todos los datos necesarios para mostrarla. Aconsejarte como estructurar tu aplicación es dificil pues sólo tu sabes los detalles particulares de esta. Siempre puedes darte una vuelta por el chat y compartir detalles. Creo que ese sería un formato más adecuado.
Commented
el 5 jun. 2016 a las 14:17
Si lo único que buscas es implementar disqus en tu aplicación web con Angularjs, esta es la solución más simple.
https://github.com/michaelbromley/angularUtils/tree/master/src/directives/disqus