Интерфейс не будет работать с переменной (Object), где значение объявлено с функцией (Return) - TypeScript

Question

Я создаю приложение с Ionic v3 . По какой-то причине мой интерфейс не будет работать, когда значение переменной возвращается функцией.

Например, это нормально работает.

export interface Quote {
    title: string;
}


export class HomePage {

   quote: Quote;

   constructor(public navCtrl: NavController) {
       var foo = { title: 'Lorem ipsum dorem.' };
       this.quote = foo; // Logs as {title: "Lorem ipsum dorem."}
   }
}

Но как только я получу значение, возвращаемое функцией. Вещи не будут работать. (Тот же интерфейс, т. Д.)

quote: Quote;

constructor(public navCtrl: NavController) {
   // Get & set qoute
   this.quote = this.getQuote();
   console.log(this.quote); // Returns: {title: "Lorem ipsum dorem."}
}

// Get random quote
getQuote(category: string = undefined) : object {
    const quotes = [
        {
            title: 'Lorem ipsum dorem.'
        },
        {
            title: 'Lorem ipsum dorem.'
        },
        {
            title: 'Lorem ipsum dorem.'
        }
    ];

    if (category == undefined) {
        return quotes[Math.floor(Math.random() * quotes.length)];
    }
}

Но как только я захочу создать приложение как APK, оно скажет:

line: 21
  Type 'object' is not assignable to type 'Quote'. Property 'title' is missing in type '{}'.
  L20:  // Get & set qoute
  L21:  this.quote = this.getQuote();
  L22:  console.log(this.quote);

Полагаю, я мог бы просто установить значение this.quote в функции. Но почему это не работает? Спасибо за помощь.

Answer 1

Вы не используете интерфейс. Вы должны ввести возвращаемое значение getQuote для Quote и ввести массив как массив quote. Теперь TypeScript может должным образом обеспечивать целостность кода. Примерно так должно работать:

getQuote(category: string = undefined) : Quote {
    const quotes: Quote[] = [
        {
            title: 'Lorem ipsum dorem.'
        },
        {
            title: 'Lorem ipsum dorem.'
        },
        {
            title: 'Lorem ipsum dorem.'
        }
    ];

    if (category == undefined) {
        return quotes[Math.floor(Math.random() * quotes.length)];
    }
}

Answer 2

проблема с типами. Вы определяете результат как объект:

getQuote(category: string = undefined) : object {..}

но оно должно быть типа

getQuote(category: string = undefined) : Quote {

Answer 3

object в TypeScript - это общая категория, которая охватывает все объекты.Когда вы приводите ваш объект к object, приложение больше не может видеть его свойства, поэтому оно не знает, что ваш объект соответствует интерфейсу.

Чтобы исправить это, просто измените вашу функцию наgetQuote(category: string = undefined) : Quote