The problems that jquery steps has with angular 4 is that it does not work for me to bind a field within jquery steps. that is, in the component I have a variable called
public borrar:string;
then a method
loadInfo() {
this.borrar = "hola mundo"
}
in the view that redenders I have
<input type="button" (click)="loadInfo();" value="aqui">
{{ borrar }}
When I click everything works normal. Shows the value of the variable. but if I put it where jquery steps is applied it doesn't work. It shows nothing and no error. nor value of the variable.
the following script is to apply jquery steps
var form = $("#example-form");
form.validate({
errorPlacement: function errorPlacement(error, element) { element.before(error); },
rules: {
confirm: {
equalTo: "#password"
}
}
});
form.children("div").steps({
headerTag: "h3",
bodyTag: "section",
transitionEffect: "slideLeft",
onStepChanging: function (event, currentIndex, newIndex)
{
form.validate().settings.ignore = ":disabled,:hidden";
return form.valid();
},
onFinishing: function (event, currentIndex)
{
form.validate().settings.ignore = ":disabled";
return form.valid();
},
onFinished: function (event, currentIndex)
{
alert("Submitted!");
}
});
When applying form.children("div").steps
all the variables that are inside the form with id "#example-form" they stop working, they are not shown at all. I've been looking for days how to solve this and I can't find a way to solve it.
The main reason that doesn't work is that the jquery-steps plugin removes your html markup.
jquery.steps.js
Additional Information:
CKEditor you can get and use in Angular. You can install it in the following way and use it in your components or main module:
You can read its documentation and how to use it, here .
KCFinder:
I can recommend this FileManager, which I searched for but in the end did not implement: FileManager