W jaki sposób wywołać od razu handler dla setInterval()?

Chciałbym żeby po załadowaniu strony Od razu w danym divie był już jakiś cytat ,bo w innym razie mam pusty div przez 10 pierwszych sekund .
Pragnę dodać iż jestem początkujący więc prosze o uprzejmość

setInterval(function() {
  var maszyna = Math.floor(Math.random() * cytaty.length);
document.getElementById('slajdcytaty').innerHTML = cytaty[maszyna];
} ,10000);


 export const cytaty =[

    "\"Jeśli potrafisz się wyzwolić od słuchania o sobie i swojej pracy, to radzę ci,"
     + " byś nie wierzył w komplementy i miłe rzeczy, które słyszysz o sobie. Większość "
     + "jest nieszczera i spora część jest mylna - czyli zostaje niewiele.\""+'<br>'+" ~ Woody Allen,",
..................................................... 

    ];

function odswiezCytat() {
  var maszyna = Math.floor(Math.random() * cytaty.length);
  document.getElementById('slajdcytaty').innerHTML = cytaty[maszyna];
}

odswiezCytat();

setInterval(odswiezCytat, 10000);

Patryk27 napisał(a):

function odswiezCytat() {
  var maszyna = Math.floor(Math.random() * cytaty.length);
  document.getElementById('slajdcytaty').innerHTML = cytaty[maszyna];
}

odswiezCytat();

setInterval(odswiezCytat, 10000);

Niestety jest do błedne zastosowanie kodu :/ wywala jakiś error w consoli

Jak idziesz do lekarza to też mówisz no coś tam gdzieś tam mnie boli, czy raczej próbujesz opisać problem w miarę dokładnie?

Patryk27 napisał(a):

Jak idziesz do lekarza to też mówisz no coś tam gdzieś tam mnie boli, czy raczej próbujesz opisać problem w miarę dokładnie?

Fakt przepraszam :/ Więc gdy zastosowałem ten kod TS to po odswiezeniu strony miałem wyłącznie samo tło bez zadnych elementów htmla , a error w consoli wygląda następująco :

app.component.ts:17 Uncaught ReferenceError: Cannot access 'cytaty' before initialization
at odswiezCytat (app.component.ts:17)
at Module../src/app/app.component.ts (app.component.ts:21)
at webpack_require (bootstrap:79)
at Module../src/app/app.module.ts (app.component.ts:55)
at webpack_require (bootstrap:79)
at Module../src/main.ts (environment.ts:16)
at webpack_require (bootstrap:79)
at Object.0 (main.ts:12)
at webpack_require (bootstrap:79)
at checkDeferredModules (bootstrap:45)

Cannot access 'cytaty' before initialization

Komunikat brzmi logicznie - niestety wrzuciłeś za mało kodu, aby coś sensownego podpowiedzieć (głównie dlatego, że Twój kod nie zawiera ani grama Angulara).

Patryk27 napisał(a):

Cannot access 'cytaty' before initialization

Komunikat brzmi logicznie - niestety wrzuciłeś za mało kodu, aby coś sensownego podpowiedzieć (głównie dlatego, że Twój kod nie zawiera ani grama Angulara).

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'strona';
}

function startCytaty() {
  var maszyna1 = Math.floor(Math.random() * cytaty.length);
  document.getElementById('slajdcytaty').innerHTML = cytaty[maszyna1];
}

setInterval(function() {
  var maszyna = Math.floor(Math.random() * cytaty.length);
document.getElementById('slajdcytaty').innerHTML = cytaty[maszyna];
} ,10000);

 export const cytaty =[

    "\"Jeśli potrafisz się wyzwolić od słuchania o sobie i swojej pracy, to radzę ci,"
     + " byś nie wierzył w komplementy i miłe rzeczy, które słyszysz o sobie. Większość "
     + "jest nieszczera i spora część jest mylna - czyli zostaje niewiele.\""+'<br>'+" ~ Woody Allen,",

     "\"Film, który da się opowiedzieć, to nie jest dobry film.\" "+'<br>'+" ~ Michelangelo Antonioni,",

     "\"Kiedy jest się artystą, tworzy się filmy, ważny jest brak konsekwencji. Trzeba być niekonsekwentnym. "
     +"Jeżeli jest się konsekwentnym, piękno wymyka nam się, znikaz naszego dzieła. Pod względem uczuciowym należy być spójnym. "
     +"Nie wolno spójnym nie być. Ale jeżeli ufa się własnym emocjom, kiedy zawierza się swojej twórczej wyobrażni, można sobie "
     +"pozwolić na całkowity brak konsekwencji. Nic nie szkodzi. Gdyż jest się w stanie zrozumieć "
     +"konsekwencje swoich emocji. Na zawsze.\""+'<br>'+" ~ Ingmar Bergman,",
];

function startCytaty() {
  var maszyna1 = Math.floor(Math.random() * cytaty.length);
  document.getElementById('slajdcytaty').innerHTML = cytaty[maszyna1];
}

Próbowałem powyższą funkcją wywołać poprzez onload w danym divie ,wystartowanie cytatu . Zapisywałem cos w stylu

Szedłbym w stronę czegoś takiego:

export class AppComponent implements OnInit {
  readonly quotes = [
    'pierwszy cytat',
    'drugi cytat',
  ];

  currentQuote: string;

  ngOnInit() {
    this.refreshQuote();

    setTimeout(() => this.refreshQuote(), 1000);
  }

  refreshQuote() {
    this.currentQuote = this.quotes[...];
  }
}

Btw, powinieneś najpierw poznać JSa, a dopiero potem zabierać się za Angulara - póki co sprawiasz wrażenie osoby próbującej przykręcić śrubę z wykorzystaniem łyżki (np. poprzez łączenie komponentów Angulara z getElementById).

import { Component } from '@Angular/core';

@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'strona';

tekst = cytaty[Math.floor(Math.random()*8)]

}

function startCytaty() {
var maszyna1 = Math.floor(Math.random() * cytaty.length);
var cos = document.getElementById('slajdcytaty').innerHTML= cytaty[maszyna1];

}

setInterval(startCytaty ,10000);

export const cytaty =[

 "\"Jeśli potrafisz się wyzwolić od słuchania o sobie i swojej pracy, to radzę ci,"
 + " byś nie wierzył w komplementy i miłe rzeczy, które słyszysz o sobie. Większość "
 + "jest nieszczera i spora część jest mylna - czyli zostaje niewiele.\""+'<br>'+" ~ Woody Allen,",

 "\"Film, który da się opowiedzieć, to nie jest dobry film.\" "+"<br>"+" ~ Michelangelo Antonioni,",

 "\"Kiedy jest się artystą, tworzy się filmy, ważny jest brak konsekwencji. Trzeba być niekonsekwentnym. "
 +"Jeżeli jest się konsekwentnym, piękno wymyka nam się, znikaz naszego dzieła. Pod względem uczuciowym należy być spójnym. "
 +"Nie wolno spójnym nie być. Ale jeżeli ufa się własnym emocjom, kiedy zawierza się swojej twórczej wyobrażni, można sobie "
 +"pozwolić na całkowity brak konsekwencji. Nic nie szkodzi. Gdyż jest się w stanie zrozumieć "
 +"konsekwencje swoich emocji. Na zawsze.\""+"<br>"+" ~ Ingmar Bergman,",

 "\"Reżyseria filmu polega na łączeniu istot poprzez spojrzenie...\""+"<br>"+" ~ Robert Bresson,",

 "\"Dopiero kiedy zaczynamy tracić pamięć, choćby po trochu, zdajemy sobie sprawę, że pamięć jest istotą całego naszego życia. "
 +"Życie bez pamięci nie byłoby życiem (...) Nasza pamięć jest naszą spójnią, naszym rozumem, naszym działaniem, naszym uczuciem. "
 +"Bez niej jesteśmy niczym.\""+"<br>"+" ~ Luis Bunuel,",
 
 "\"Kino to nie jest zawód. Kino to jest sztuka. Nie tworzy go ekipa. Jest się zawsze samotnym, "
 +"tak samo na planie, jak przed białą kartką. A dla Bergmana być samotnym, to znaczy stawiać pytania."
 +"A robić filmy, to na te pytania odpowiadać...\""+"<br>"+" ~ Jean-Luc Godard,",

 "\"Oczekiwanie na niebezpieczeństwo jest gorsze niż moment, gdy ono na człowieka spada.\""+"<br>"+" ~ Alfred Hitchcock,",

 "\"Nieważne, gdzie się stawia kamerę, ważne - po co...\""+"<br>"+" ~ Krzysztof Kieślowski,", 

 "\"W moim przekonaniu, sztukę stać na coś znacznie większego - na przypominanie człowiekowi o jego godności...\""+"<br>"+" ~ Andrei Tarkovsky,",

];


    <div class="cytaty">
    <strong><em><blockquote id="slajdcytaty"><cite>{{ tekst }}</cite></blockquote></em></strong>

    </div>

Hmm niby wszystko działa tka jak chciałem , pojawia się losowy cytat gdzy zaladuje strone i co 10 sekund sie zmienia ,ale zawsze ten 1 raz jes inny poniewaz nie odbiera mi znacznika br ktoś wie jak ominąć ten błąd nie zmieniajac zbytnio struktury tego co mam ? Czy się nie da ??

Dlaczego tak koszmarnie komplikujesz coś, co jest banalnie proste? Wszystko, co potrzebujesz to:

Zdefiniować tablicę cytatów:

cytaty = ["Saab", "Volvo", "BMW", "Cytat z przełamaniem<br>wiersza."];

Zdefiniować funkcję losującą i wklejającą do DIVa

function losuj_cytat() {
  var indeks_wylosowany = Math.floor(Math.random() * cytaty.length);
  var cos = document.getElementById('slajdcytaty').innerHTML= cytaty[indeks_wylosowany];
}

A jak już oba powyższe masz już zdefiniowane a DIV#slajdcytaty jest załadowany wywołujesz tę funkcję i uluchamiasz jej cykliczne uruchamianie:

losuj_cytat();
setInterval(losuj_cytat, 10000);

Freja Draco napisał(a):

Dlaczego tak koszmarnie komplikujesz coś, co jest banalnie proste? Wszystko, co potrzebujesz to:

Zdefiniować tablicę cytatów:

cytaty = ["Saab", "Volvo", "BMW", "Cytat z przełamaniem<br>wiersza."];

Zdefiniować funkcję losującą i wklejającą do DIVa

function losuj_cytat() {
  var cytat_wylosowany = Math.floor(Math.random() * cytaty.length);
  var cos = document.getElementById('slajdcytaty').innerHTML= cytaty[cytat_wylosowany];
}

A jak już oba powyższe masz już zdefiniowane a DIV#slajdcytaty jest załadowany wywołujesz tę funkcję i uluchamiasz jej cykliczne uruchamianie:

losuj_cytat();
setInterval(losuj_cytat, 10000);

Okej dzieki ,lecz ktos wczesniej tak samo mi napisał ,wiec wykonałem to i nastepnie mialem jakis error w consoli .Btw do jakiegos stringa dalem =settimeout(funkcja,1) i równiez dziala

a dokładnie to mam tak i ten tekst dałem w divie w interpolacje {{tekst}}

export const tekst = setTimeout(startCytaty, 0);

function startCytaty() {
var maszyna1 = Math.floor(Math.random() * cytaty.length);
var cos = document.getElementById('slajdcytaty').innerHTML= cytaty[maszyna1];

}

setInterval(startCytaty ,10000);

export const cytaty =[];

Dziękuje wszystkim ,Temat do zamknięcia

Greedri napisał(a):

Okej dzieki ,lecz ktos wczesniej tak samo mi napisał ,wiec wykonałem to i nastepnie mialem jakis error w consoli

Jakieśbłędy to jedne z najgorszych :p

Zero errorów:

<!DOCTYPE html>
<html>
<head>
<title>losowe cytaty</title>
<style>
</style>
</head>
<body>

<div id="slajdcytaty"></div>

<script>
var cytaty = ["Saab", "Volvo", "BMW", "Cytat z przełamaniem<br>wiersza."];

function losuj_cytat() {
  var cytat_wylosowany = Math.floor(Math.random() * cytaty.length);
  var cos = document.getElementById('slajdcytaty').innerHTML= cytaty[cytat_wylosowany];
}

losuj_cytat();
setInterval(losuj_cytat, 1000);

</script>
</body>
</html>