What needs to be changed?
- Get a Google Sheets API key. Here is a short how-to!
- Share your sheet so that "Anyone on the internet with this link can view". Here is a short how-to!
- In your app's module provide this API key in the
providers
:
import { HttpClientModule } from '@angular/common/http';
import { API_KEY, GoogleSheetsDbService } from 'ng-google-sheets-db'; // <-- API_KEY is new
@NgModule({
...
imports: [
HttpClientModule,
...
],
providers: [
{
provide: API_KEY, // <-- this is new
useValue: <YOUR_GOOGLE_SHEETS_API_KEY>, // <-- this is new
},
GoogleSheetsDbService
],
...
})
export class AppModule { }
- When using it in your component, you need to pass the sheet name instead of the sheet index:
import { GoogleSheetsDbService } from 'ng-google-sheets-db';
@Component({
...
})
export class YourComponent implements OnInit {
characters$: Observable<Character[]>;
constructor(private googleSheetsDbService: GoogleSheetsDbService) { }
ngOnInit(): void {
this.characters$ = this.googleSheetsDbService.get<Character>(
'1gSc_7WCmt-HuSLX01-Ev58VsiFuhbpYVo8krbPCvvqA',
'Characters', // <-- this argument has changed: The sheet _name_ is "Characters"
characterAttributesMapping
);
}
- The
_prefix
es in your attributesMapping
might need a trailing whitespace. See the example app and spreadsheet.