Как выбрать часть моего массива для границы CSS?

Question

Как выбрать часть моего массива для границы CSS?

1

Мне нужно создать границу вокруг каждого из этих трех контактов. Таким образом, три границы. Я использую угловой /Typcript. Мне нужно вставить код границы в файл css в моем проекте. Спасибо!

 import { Injectable } from '@angular/core';
 import { Contact } from '../models/contact';

 @Injectable({
  providedIn: 'root'
 })

  export class ContactsService {
  contacts: Contact[] = [
   { 
    firstName: 'John',
    lastName: 'Doe',
    phoneNumber: '1234567890',
    email: '[email protected]'
  },
 {
    firstName: 'Killiam',
    lastName: 'Jones',
    phoneNumber: '0987654321',
    email: '[email protected]'
  },
 {
   firstName: 'Emma',
   lastName: 'Swan',
   phoneNumber: '35715948620',
   email: '[email protected]'
 }
 ];
 constructor() {}
 }

Seth VanHaelst 06 авг. 2018, в 09:59

Источник

0

Вы должны рисовать эти массивы на ваш взгляд. Итак, в идеале вам нужно применить Css к элементам DOM.
Charu Maheshwari 06 авг. 2018, в 07:21
0

@CharuMaheshwari Не уверены, что вы имеете в виду? Было бы легко, если бы я мог выбрать каждый из этих контактов и назначить им новый класс или идентификатор, но я не могу. Можете ли вы показать мне правильный синтаксис?
Seth VanHaelst 06 авг. 2018, в 07:52
0

Смотрите следующий ответ, если это то, что вы хотите.
Charu Maheshwari 06 авг. 2018, в 08:16

Показать ещё 1 комментарий

Теги:

javascript

arrays

css

1 ответ

Ещё вопросы

Вы должны рисовать эти массивы на ваш взгляд. Итак, в идеале вам нужно применить Css к элементам DOM.
@CharuMaheshwari Не уверены, что вы имеете в виду? Было бы легко, если бы я мог выбрать каждый из этих контактов и назначить им новый класс или идентификатор, но я не могу. Можете ли вы показать мне правильный синтаксис?
Смотрите следующий ответ, если это то, что вы хотите.

Charu Maheshwari · Answer 1 · 2018-08-06T05-51-00.000Z

Попробуйте использовать приведенный ниже фрагмент кода. Я имел в виду это.

 <style>
    .contact-detail {
       border: solid 1px red;
    }
    </style>
     <div *ngFor="let contact of contacts" class="contact-detail">
        {{contact.firstName}}
        {{contact.lastName}}......
     </div>

ОЙ! Отличная идея не думала об этом. Я сделал этот фрагмент. Удивительно, но это сработало, поскольку между каждым из массивов были запятые p {background-color: tomato; белый цвет; отступы: 10 пикселей; выравнивание текста: по центру; семейство шрифтов: Arial, Helvetica, без засечек; list-style-type: нет; }
Привет .. @ SethVanHaelst, не уверен, что на твой вопрос отвечают или тебе нужна дополнительная помощь?