t4t5 / sweetalert

A beautiful replacement for JavaScript's "alert"
https://sweetalert.js.org
MIT License
22.4k stars 2.84k forks source link

Types of property 'content' are incompatible #820

Closed mulatorarg closed 5 years ago

mulatorarg commented 6 years ago

By following the example:

swal("Type something:", {
  content: "input",
})
.then((value) => {
  swal(`You typed: ${value}`);
})

Or its version with promises

const value = await swal("Type something:", {
  content: "input",
});
swal(`You typed: ${value}`);

Throw messages:

ERROR in src/app/pages/user/user.component.ts(108,42): error TS2345:
Argument of type '{ content: string; }' is not assignable to parameter of type 'string | Partial<SwalOptions>'.
  Type '{ content: string; }' is not assignable to type 'Partial<SwalOptions>'.
    Types of property 'content' are incompatible.
      Type 'string' is not assignable to type 'ContentOptions'.
src/app/pages/user/users.component.ts(189,42): error TS2345: Argument of type '{ content: string; }' is not assignable to parameter of type 'string | Partial<SwalOptions>'.
  Type '{ content: string; }' is not assignable to type 'Partial<SwalOptions>'.
    Types of property 'content' are incompatible.
      Type 'string' is not assignable to type 'ContentOptions'.
MichFe commented 5 years ago

I also have this issue @Gabrielus , were you able to solve it?

mulatorarg commented 5 years ago

Yes. But now I do not remember the code used. Then I share the solution. Thanks for asking!!

tareqimbasher commented 5 years ago

Unfortunately the TypeScript definitions file associated with this library has many issues. To solve this one use it like so:

content: {
   element: "input"
}

I'm still trying to use the buttons option as shown in the docs using TypeScript.

ricnef2121 commented 5 years ago
swal("Type something:", {
  content: "input",
} as any)
.then((value) => {
  swal(`You typed: ${value}`);
})
mulatorarg commented 5 years ago

Thank you all. I had already solved it a long time ago. I share my solution and I close the issue.

async preCambiarClave() {
    const value = await swal('Ingrese la nueva contraseña (mínimo 6 caracteres):', {
      content: {
        element: 'input',
        attributes: {
          placeholder: 'Nueva contraseña',
          type: 'password',
          value: ``
        }
      }
    });
    if (value.length >= 6) {
      this.usuario.clave = value;
      this.cambiarClave();
    } else {
      swal('Ups', 'La contraseña debe tener al menos 6 caracteres.', 'error');
    }
  }