Как сохранить правила стиля отдельно для разных страниц в приложениях Ionic2?

У меня есть три разных файла app.scss, movie-info.scss, movie-list.scss. В файле app.scss есть следующий комментарий:

Поместите сюда правила стиля, которые вы хотите применить глобально. Эти стили предназначены для всего приложения, а не только для одного компонента. Кроме того, этот файл также можно использовать в качестве точки входа для импорта других файлов Sass, которые будут включены в выходной CSS.

Это означает, что стили здесь будут применяться ко всему приложению. По этой причине я поместил стили для movie-info страницы внутрь movie-info.scss. Однако размещенные там стили по-прежнему влияют на страницу movie-list. Почему это? Какова цель использования разных файлов scss, если стили применяются ко всему приложению?


ionic-framework sass ionic2
person Neena Vivek    schedule 17.01.2017    source источник
comment
Вы можете указать фильм-info.scss в вопросе?   -  person Suraj Rao    schedule 17.01.2017
comment
@suraj Пожалуйста, подождите. :)   -  person Neena Vivek    schedule 17.01.2017
comment
«По этой причине я поместил стили для страницы с информацией о фильме в файл movie-info.scss». Как вы его добавили?   -  person Suraj Rao    schedule 17.01.2017

Ответы (1)


arrow_upward
2
arrow_downward

В вашем файле movie-info.scss должно быть задано пространство имен. Например:

movie-info-page{
//css style here
}

Это пространство имен задается в вашем компоненте как селектор.

@Component({
    selector: ' movie-info-page',
    templateUrl: 'movie-info.html',
})

Любой стиль, помещенный внутри пространства имен, применяется к конкретной странице. Все стили снаружи устанавливаются как глобальные и будут устанавливаться со страницы на все последующие страницы. Если вам нужен глобальный стиль для всего приложения, установите его в app.scss Надеюсь, это ответит на ваш вопрос.

person Suraj Rao    schedule 17.01.2017
comment
Спасибо сурадж. Теперь я понимаю концепцию правил стиля. :) - person Neena Vivek; 17.01.2017