Angular2 - inputタグの枠にゼロ以上の整数しか入力できないようにする方法

Question

Angular CLI: 10.1.0
Node: 12.18.3
OS: linux x64

Angular: 10.1.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1001.0
@angular-devkit/build-angular     0.1001.0
@angular-devkit/build-optimizer   0.1001.0
@angular-devkit/build-webpack     0.1001.0
@angular-devkit/core              10.1.0
@angular-devkit/schematics        10.1.0
@angular/cdk                      10.2.0
@angular/material                 10.2.0
@ngtools/webpack                  10.1.0
@schematics/angular               10.1.0
@schematics/update                0.1001.0
rxjs                              6.6.3
typescript                        4.0.2
webpack                           4.44.1

Angular2でHTMLinputElementにゼロ以上の整数しか入力できないようにしたいと思いました。
はじめにtype=numberとしましたが、右端に上矢印と下矢印が出てくるので要求に合わず。

次に、入力された文字のASCIIコードを用いて条件分岐でその他の文字を弾こうと思い次のようなコードを作ったのですが、その他の文字列が入力されてしまいます。

  public items: {id: number, name: string, num: number, price: number}[] = [
      {id: 1, name: 'banana', num: 1, price: 200},
      {id: 2, name: 'apple', num: 2, price: 100}, ...
  ];
  public handleNumInputs(keyCode, num): void {
      if (keyCode < 47 || keyCode > 58) {
          num = 0; 
      }
  }

<form>
	<input [value]="item.num" (keyup)="handleNumInputs($event.keyCode, item.num)" type="text">
</form>	                

tsの八行目の次にconsole.log(num)とし、numを確認したところ、思ったとおりの値になっていました。とするとdomのvalueプロパティとitem.numがうまく同期していないのでしょうか？

viewとclassの同期というと、2 way bindingというものがありますがこれは単純に同期させるのではなく値を検証してから同期させる今回の場合には使えないのでしょうか？

1.キーが押されて関数が実行される。

2.関数内でnumがアップデートされる。

3.domのvalueプロパティとitem.numが同じ値になる。

の3がうまく行っていないように思えます。３を上手くさせるにはどうすればよいでしょうか？どこの記述が間違っている（もしくは足りない）のでしょうか？