J'ai une application Angular 5 dans un sous-répertoire d'une autre application parent.

L'application parente est un ensemble de JSP, et d'autres applications angularJs ... etc.

Ce que j'essaie de faire est d'inclure un fichier CSS, à partir de cette application parent, dans un composant de l'application Angular 5.

@Component({
  selector: 'app-my-form',
  templateUrl: './my-form.component.html',
  styleUrls: [....] //Here
})

C'est possible ?

J'ai regardé cette question: Charger un style CSS externe dans Angular 2 Component déjà demandé, mais cela ne correspond pas à mon cas.

Merci de votre aide

3
Lyes CHIOUKH 13 avril 2018 à 17:44

3 réponses

Meilleure réponse

Dans le fichier .angular-cli.json de votre application enfant, recherchez la propriété styles de votre application. Ajoutez-y le chemin d'accès à votre CSS parent.

Voici un exemple de configuration JSON.

 "apps": [
    {
      "styles": [
        "../../../../apec-template-bootstrap-responsive/src/main/resources/css/old-apec.css",
        "styles.css"
      ],
    }
  ],

Cela devrait donner à votre application enfant le style dont vous avez besoin de la part du parent.

2
Malcor 13 avril 2018 à 15:29

Votre styleUrls peut être celui par défaut:

styleUrls: './my-form.component.css'

Tandis que dans votre my-form.component.css , vous pouvez importer les fichiers CSS que vous souhaitez:

@import ".../component.css";
0
Gabax 13 avril 2018 à 14:50

Essayez ce qui suit:

@Component({
  selector: 'app-my-form',
  templateUrl: './my-form.component.html',
  styleUrls: ['my-form.css']
})

Votre fichier sera un fichier SCSS: myform.scss.

Et puis vous pouvez importer un fichier CSS externe comme celui-ci:

@import "my-external-stylesheet.css"; // this on the top of `my-form.scss`
3
SrAxi 13 avril 2018 à 14:48